Sign Up to our social questions and Answers Engine to ask questions, answer people’s questions, and connect with other people.
Login to our social questions & Answers Engine to ask questions answer people’s questions & connect with other people.
Lost your password? Please enter your email address. You will receive a link and will create a new password via email.
Please briefly explain why you feel this question should be reported.
Please briefly explain why you feel this answer should be reported.
Please briefly explain why you feel this user should be reported.
what do the background refer to in the box model (content, padding, border and margin)?
in other words, which part of the box model will be set to display a background color if i set it to green?
and is it just block elements (div, heading etc) that applies to the box model? do inline elements (span, text) got padding, border and margin too?
This small chart will demonstrate how a box appears within the browser:
box-chart http://img132.imageshack.us/img132/2692/boxchart.jpg
As you can see, the margin is the space between the box itself and any content that might be surrounding it. The border is simply a line around the box. The padding is the space between the edge of the box and the content within the box. Any backgrounds you set will fill the entire box (within the borders) still maintaining the margin (blank space) around the box.
Just about every element can use margin, background, and border I believe. However, some elements do not support padding unless it is block-level, because it would basically be the exact same thing as margin. You can always test out different styles to see what works and what doesn’t and how things get moved around based on the styles you set up.