"CSS Layout Techniques" was retired on February 22, 2017. You are now viewing the recommended replacement.

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 Layout Techniques Display Modes Table Display

Layouts - Responsive

In the video, the padding was used in pixels and when a media query was added to the max-width of 768px , the padding had to be reset to its initial value.

If padding was converted from pixels to percentages, would it still be necessary to reset the padding in a media query? and could you do the same with the width and margins and fonts. Start with a fluid grid and there would be less work or scaling in the media query?

1 Answer

You can indeed use percentages with your padding to avoid using as many media queries, if it suits your design. Another alternative is to use the "box-sizing" property, which allows for static padding on an element with a dynamic width to not exceed the desired width.

Here is a great resource to learn more about box-sizing: http://www.w3schools.com/cssref/css3_pr_box-sizing.asp