Welcome to the Treehouse Community

The Treehouse Community is a meeting place for developers, designers, and programmers of all backgrounds and skill levels to get support. Collaborate here on code errors or bugs that you need feedback on, or asking for an extra set of eyes on your latest project. Join thousands of Treehouse students and alumni in the community today. (Note: Only Treehouse students can comment or ask questions, but non-students are welcome to browse our conversations.)

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and a supportive community. Start your free trial today.

HTML

Setting divs height in %

I have so far created a static web layout using html/css and now I'm at the process of converting it to a responsive layout. Because I have some divs with height declared in absolute px values I would like to know which the best practice is for converting them into percentages. I've read some articles where it is suggested to change the body and html tags height into 100% , but doesn't seem to do the trick.

Thank you

3 Answers

James Barnett
James Barnett
39,199 Points

In general, you should set your container div to a fixed width in pixels using media queries. If you need a refresher on media queries check out the Build a Responsive Website course.

We can be of more help if you create a codepen so we can better see the larger picture as it were.

Hello James

I guess what you suggest is to set a specific height which through media queries will vary according to the resolution applied. Here is more or less the layout [http://cdpn.io/pKmEt].

Thank you

Blair Rorani
Blair Rorani
6,658 Points

And, how does this apply to top/bottom margins/padding? It seems wrong to use the width as the context for these calculations.