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
hoppy bouasavanh
Courses Plus Student 1,791 PointsWhy we set the default of .wrapper as 940px?
instead of %.
6 Answers
James Casavant
21,522 PointsI am not entirely sure I understand the question, but perhaps the following will be helpful?
The children elements will be following of their parent elements, which is not necessarily "body". "Body" is the direct parent of "header" "div - wrapper" and "footer". If the body were set to 940px that would also set the header and the footer to 940px, however the design of the site only calls for the gallery section (the wrapper div) to be 940px, not the header and footer.
The images set inside the "wrapper" div will calculate their percentages in relation to their parent (the wrapper div) not the body (which is basically a grand-parent to them). So if you have a child image inside of "div wrapper" and you set it to be a width of 45% it will be 45% the width of it's parent (the div wrapper) not the body.
As to why 940px was chosen instead of something like 80% it is due to it being part of what could be considered current best-practice (by the logic I explained in the my answer).
James Casavant
21,522 Points940px has basically become a "standard" in practice. For a long time It was unusual to see screens larger than 1024x768px, so 940px was a good choice because a webpage that size it would always fit the screen. It allows some white-space on either side and you can divide it nicely into columns if needed.
hoppy bouasavanh
Courses Plus Student 1,791 PointsThank you. but why don't we set body as 940px instead of .wrapper?
Mohsin Ayub
6,822 PointsI think the pixels has more precise control on layout because it is the smallest unit on screen. And when we set the max-width property to pixels then it will look good on too wide screens because we set its maximum width to 940 or something else. But when we set it in percentages may be it looked too wide on wide screen and may interrupt the readability. Percentages are relative to the browser viewport widths so they will increase as the browser width increase.
James Casavant
21,522 PointsIt's good practice to allow the <body> element to fill the entire body of the document (hence it's name) and then to wrap content that you want placed in a specific location within that body in a "wrapper".
hoppy bouasavanh
Courses Plus Student 1,791 Pointsit's a bit difficult to understand. what if we set <body> a width of 940px , because we have to set % of other children element by following the body?
James Casavant
21,522 PointsYou're welcome! If you like the answer, you can always click on "best answer" to throw me a few points ;).
-James
hoppy bouasavanh
Courses Plus Student 1,791 PointsSure. Could u tell me what is the usage of those point?
Regardless, could u solve my another doubt? https://teamtreehouse.com/forum/why-the-margin-of-gallery-li-is-25-instead-of-5-please
James Casavant
21,522 PointsIt seems like "Hugo Paz" already took care of the other one, if you have any other questions feel free to post, I will be around whenever I am taking lessons.
And by the way, thanks for the Best Answer, I appreciate it!
Best. James
hoppy bouasavanh
Courses Plus Student 1,791 Pointshoppy bouasavanh
Courses Plus Student 1,791 PointsReally clear,, thx a lot for your time.