Trying to get background to work with border.

[Shura11]

Alright so I'm trying to do coding for Borders and Backgrounds. I want them to be separate codes So if someone wants only the background they can only get a background and vice versa. So I added padding to both codes But I also want them to blend when used together so yeah. Essentially I want to do this: (Its on another site)



And this is what I keep getting on my site



SO im not sure what to do... if it involves just the Mybb thing or if I also have to go into the CSS. I appreciate any help given. 

Border: <div style="border-style:$1; border-color:$2; border-width:$3;padding:10px;">$4</div>

Background: <div style="background-color:$1; background-image: url($1); padding:10px;">$2</div>

[alirex]

Use png image. If someone will use jpg or animated gif then things can look bad.

Border: <div style="border-style:$1; border-color:$2; border-width:$3;padding:10px;">$4</div>

Background: <div style="background: $1 url('$1'); padding:10px; height:some px; width:some px;">$2</div>

Background image actually require height and width too. Which is not mentioned. Adjust padding according to height and width or it will exceed your boundaries.