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

CSS CSS Basics (2014) Basic Layout box-sizing and max-width

rajbee
rajbee
6,657 Points
Posted by rajbee
rajbee
6,657 Points

Max width 100%

At 5:37, he says that max-width is 100%. 100% of what ?

3 Answers

Julian Aramburu
Julian Aramburu
11,368 Points
Julian Aramburu
Julian Aramburu
11,368 Points

Hi Raj! When you set the width or height of some element to be 100% ...it means "make this element’s content area exactly equal to the explicit width of its parent — but only if its parent has an explicit width." so if the parent element has a width of 400px , at 100% the child element will be 400px width. In this link (http://www.impressivewebs.com/width-100-percent-css/) you can find some further explanation and study cases :)! Hope it helps!

Samuel Custer
Samuel Custer
2,683 Points
Samuel Custer
Samuel Custer
2,683 Points

Of its parent element.

Don't confuse max-width with width. max-width is the maximum width an element can be. In this case, 100% of its parent element/container.

Joseph Carrillo
Joseph Carrillo
2,137 Points
Joseph Carrillo
Joseph Carrillo
2,137 Points

So if you have a h1 element in a header tag. Then you specify the header to be width of 100%. Then you specify the h1 to take up max-width of 75%. So then the h1 would take up 75% of the 100% of the parent? Am i getting this right?