You seem to have misunderstood the post since nowhere does it suggest the order of declared CSS properties affects the outcome.
I'm guessing the intent was to highlight the different behaviour when you nest multiple elements with em or rem units applied: jsfiddle.net/blindfish/2xqc1f9d/18/
The general consensus when I last did any serious research on the matter (a while ago) was that for predictable results em should be used with caution. IIRC there was a fun IE bug that didn't help its reputation much.
And to clarify the difference:
rem: sized relative to page root
em: sized relative to parent
If you use nothing but em units on deeply nested content good luck to you!
A front-end developer from Mar del Plata, Argentina. Passionate about CSS, accessibility, and JS. Currently working on "just a small fix", as I've been doing for the last 15 years.
You seem to have misunderstood the post since nowhere does it suggest the order of declared CSS properties affects the outcome.I'm guessing the intent was to highlight the different behaviour when you nest multiple elements with em or rem units applied: jsfiddle.net/blindfish/2xqc1f9d/18/
The general consensus when I last did any serious research on the matter (a while ago) was that for predictable results em should be used with caution. IIRC there was a fun IE bug that didn't help its reputation much.
And to clarify the difference:
If you use nothing but em units on deeply nested content good luck to you!
read the post again...
Lol. Sorry: correction accepted; but my point about nested ems still stands: they can be a cause of confusion.