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 How to Make a Website Styling Web Pages and Navigation Style the Image Captions

Correct usage of units of measurement?

Hi, my question is how does one determine exactly when it is best to use px for spacing inside a box i.e. margin, border, and content vs using percentages? The reason I ask is because I've noticed throughout this course that Nick sometimes uses percentages and sometimes uses px's for measurements. Is there sort of a standard rule of thumb or best practice? I know in general you use PX's when you want precise control.

3 Answers

Percentages make the design fluid which means they react to the size of the screen they are being displayed on. Only a couple of years ago a computer monitor was all you would use to browse the web but today people are using mobiles, tablets, watches and TVโ€™s.

Good Web designers try to offer a user experience that is not effected by the type of device or display the user is viewing the site on. To achieve this โ€˜responsive designโ€™ is the way to go. Percentages play there part in responsive design by adjusting to the size of the screen. Other elements on the page maybe controlled by PX these elements will be controlled through media queries in your stylesheet which allows them to adjust in the same way.

As for best practice I would say percentages are the way forward. Although sometimes when I build a page I find it easier to create it in pixels and then go back through to figure out the percentages of those pixels at a later date. I only do this because I was brought up on them, if I was entering the industry now I would aim to use percentages as much as possible.

Jonathan Grieve
MOD
Jonathan Grieve
Treehouse Moderator 91,253 Points

Percentage widths are invaluable when converting your designs to responsive friendly layouts. If you're happy with a fixed width layout for your websites px units are absolutely fine. :-)

Ben Brenton
Ben Brenton
266 Points

This is an interesting question as it has always confused me as well. I don't believe there is any right answer - units used is really what you feel comfortable with, and also what works best with the rest of the code (for instance, em or rem measurements are relative, so they relate to units around them).

Personally, I use pixels for all my margins/borders/padding. Percentages only come into play when designating max-width or similar.