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

Jeffrey Bulman
PLUS
Jeffrey Bulman
Courses Plus Student 1,747 Points
Posted by Jeffrey Bulman
Jeffrey Bulman
Courses Plus Student 1,747 Points

Why are there so many different ways to measure margin and padding or font size ?

So i am currently getting the hang of this padding and margin stuff. I made a mistake and used pixels as a measurement when i should have used a percentage as a measurement. The pictures seemed to be spaced well on desk top level but when i minimized my window the pictures were still on top of each other so the {float:left;} property did not work. So i changed the pixel measurement to a percentage and everything seemed to sort it's self out and looked grate on the desktop layout and the mobile layout. Why is this so ?

3 Answers

Chase Lee
Chase Lee
29,275 Points
Chase Lee
Chase Lee
29,275 Points

This happens because percentages do a certain length, (or percentage), of the page. So lets say that your page is 500px high, and you set your picture measurement to 10%, that will give you 50px. Now lets say that your height had been expanded to 3980px, your new picture measurement will now be 398px.

So basically percentages make whatever you apply it to a certian size based off of the page size.

Does that all make sense?

-Chase

Nyki Lawson
Nyki Lawson
1,820 Points
Nyki Lawson
Nyki Lawson
1,820 Points

Because when you use an absolute value, like pixels, the variable stays absolute. It won't take into consideration screen size or anything else, unless there's additional code telling it to do so, because it's been told to be this one size. Period.

Percentages allow the website to detect and compensate for the screen size on which it's being viewed. Nick gets into this a lot more in the subsection on Responsive Web Design and Testing. I won't get into things like media queries, because he'll be explaining that all shortly, assuming you're continuing on the How To Create a Website lesson group.

Things will be coming together shortly, just stick with the lessons!