CSS CSS Basics The Box Model Margins

codeoverload
codeoverload
24,260 Points

Why is the em value inherited within the selector itself?

I am a little bit confused right now...
I thought 1 em is equal to the parent/container's font size, so when you use 1 em inside of the child element inherits the value from his parent element.

But why would it make sense if 1 em is always equivalent to the last font-size you used inside of the same selector.

Example code:

h2 {
  font-size: 3.3125em;  /* 53px/16px  */
  font-weight: normal;
  line-height: 1.1;
  margin-bottom: .5em;  /* 26px */
}

Is there an example which demonstrates when this inheritance inside of a selector itself would be helpful?

Thank you very much, treehouse community is awesome!

1 Answer

Kevin Korte
Kevin Korte
28,092 Points

I think this article will address your question, which is a good one by the way: http://www.teachingmultimedia.com/mmp240/HowMuchIsThatEm.html

codeoverload
codeoverload
24,260 Points

Okay, this makes a lot more sense now.

Thanks for your answer!

Kevin Korte
Kevin Korte
28,092 Points

No problem, I had to go look it up myself lmao!