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 trialdavide totaro
5,559 PointsHow does the browser calculate an element's total width value?
please help me
Ayoub AIT IKEN
12,314 PointsThanks Guil Hernandez :).
3 Answers
Jonathan Grieve
Treehouse Moderator 91,253 PointsHi Davide...
When calculating the width of an element the browser takes a number of things into account.
It has to know what the display:
property of the element is. The most common values for this property are inline, and block.
With inline
elements, are only as wide as the content on the element. With block
level elements the element takes up the width of it's containing element. This containing element could be the root (html) element of a div with a width
of say 400px
,
So in the first instance the display property has a factor.
Then there's the Box Model. Which has width and height properties for the content
, the padding
, the border
and the margin
. The total sum of all these values make up the width and height of any element. :-)
Hope this helps you. :-)
Sobin Sebastian
5,348 Pointsthe answer is "It adds any left/right padding and border-width values to the width value we define"
Ayoub AIT IKEN
12,314 Pointsby adding both left and right padding and borders width to the width value !
Guil Hernandez
Treehouse TeacherGuil Hernandez
Treehouse TeacherHi davide totaro,
Hopefully this blog post will help answer that. :)