Welcome to the Treehouse Community
Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.
Looking to learn something new?
Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.
Start your free trial
vamosrope14
14,932 PointsCan an element a be a content area for a box, as well as a box itself?
.
2 Answers
Hakim Rachidi
38,490 PointsThe content area is the inner width by inner height of an element.
.box {
box-sizing: content-box:
width: 100px;
height: 100px;
padding: 20px;
border: 5px dash blue;
}
The element with the class .box would have a content area of 100px by 100px. This picture visualizes the concept. So yes it should be the case.
vamosrope14
14,932 Points.
Hakim Rachidi
38,490 PointsDo ALL elements (including inline and block) in HTML come with padding and margin by default?
That depends on your user agents style sheet, which you can override with a css reset.
Hmm okay. So would you say that all elements are originally just their content box, except once padding and margin are applied to them?
If box-sizing is set to content-box, that is correct.
vamosrope14
14,932 Pointsvamosrope14
14,932 Points.
Hakim Rachidi
38,490 PointsHakim Rachidi
38,490 PointsIf not explicitly defined like in the above example, yes. The browser and many other markup based graphic frameworks, like WPF for windows apps, go down the markup tree, in the case of the web your html, try to get the space each child needs and then adapt the parents size accordingly.