CSS 적용시 em의 이상한 점 때문에 %로 코딩해야 하나....

딱히 어디에다가 글을 올려야 할지 몰라서 이곳에 올립니다.

CSS를 나름대로 공부하고 있던중, 이상한 점을 발견하여 글을 올립니다.

저도 처음엔 글자크기를 px로 주었지만, 가만히 생각해 보니, 요즘엔 고해상도 모니터가 많지 않습니까?? 그래서 글자크기를 변경(콘트롤+마우스휠)할 수 있는 em이나 %로 코딩을 해야겠다고 생각했습니다.

em이나 %는 그 위(상위 div 등등)의 속성을 따른다는 것은 알고 있었습니다.

여기에서 재미있는 것 하나를 발견했습니다.

이 경우에,
div1의 "하하하"는 기본크기(2em)와 같고, ==> 2em x 1em = 2em
div2의 "하하하"는 div1의 크기의 0.9em크기로 나타나고, ==> 2em x 0.9em = 1.8em
div3의 "하하하"는 div2의 크기의 0.9크기로 나타납니다. ==> 2em x 0.9em x 0.9em = 1.62em
즉, 점점 작아지게 나타나겠지요. 상위 요소의 크기에 상대적이니깐요...

여기가지는 좋다 이겁니다.

이제, 저의 본래 목적인 글자를 키웠다가 줄였다가 해 보겠습니다.
줄입니다....좋습니다. 비율대로 잘 적용됩니다.
이제 키웁니다...헛!! 이런, 가장 작아야 할 글자가 가장 커집니다.
한 번 해보세요...제가 뭘 잘못 이해하고 있는건지...

똑같은 방법으로 %로 값을 주어봤습니다.

다행히 %는 정상작동 되더군요...

그래서 저는 일단 %로 코딩하기로 했답니다....

여기에서 제가 잘못 이해한 부분이 있으면 지적해주세요...원인을 알아야 다음에 실수를 안하지요...
만일 버그라면 %로 코딩하는 수 밖에 없겠네요...