CSS CSS Basics The Box Model Margins

Rainbow Lin
Rainbow Lin
1,669 Points

How come it is 26px/53px why not 26px/16px for the bottom margin?

since he initially used 53px/16px to calculate 3.3125em. why not the same for the bottom margin?

2 Answers

Jonathan Grieve
MOD
Jonathan Grieve
Treehouse Moderator 85,148 Points

I'd have to look at the code carefully to be sure but I think it depends on what the element context is for each element. So the context px value would be the width of the parent element.

Answer is quoted : Matteo Simeone 6,211 about 2 months ago :

1 em is equal to the font size of the element to which is applied. If em units are declared on child elements in which a font-size property isn't defined, they'll inherit their font-size value from their parent. This is why in this example the margin-bottom property em unit is relative to h3 font size, while the h3 font-size property em unit is relative to the body font size

sankyeat kumar
sankyeat kumar
5,468 Points

Is it not less complicated to then use an absolute unit for font-size and margins? This way we could avoid the confusion surrounding which numbers to use when. Why are relative units given more of a preference; for a responsive design?