<div style="color: #d4d4d4; background-color: #1e1e1e; font-family: Consolas, 'Courier New', monospace; font-size: 14px; line-height: 19px; white-space: pre;">
<div><span style="color: #d7ba7d;">.main-message</span>&nbsp;{</div>
<div>&nbsp;&nbsp;<span style="color: #9cdcfe;">display</span>:&nbsp;<span style="color: #ce9178;">flex</span>;</div>
<div>&nbsp;&nbsp;<span style="color: #9cdcfe;">align-items</span>:&nbsp;<span style="color: #ce9178;">center</span>;</div>
<div>&nbsp;&nbsp;<span style="color: #9cdcfe;">justify-content</span>:&nbsp;<span style="color: #ce9178;">center</span>;</div>
<div>&nbsp;&nbsp;<span style="color: #9cdcfe;">margin</span>:&nbsp;<span style="color: #b5cea8;">5px</span>&nbsp;<span style="color: #b5cea8;">0</span>;</div>
<div>&nbsp;&nbsp;<span style="color: #9cdcfe;">height</span>:&nbsp;<span style="color: #b5cea8;">3em</span>;</div>
<div>&nbsp;&nbsp;<span style="color: #9cdcfe;">font-size</span>:&nbsp;<span style="color: #b5cea8;">2.5rem</span>;</div>
<div>}</div>
</div>
<p></p>
<p></p>
<p></p>
<p>여기서 height:3em은 현재 메인 메시지클래스의 폰트사이즈 2.5rem의 세배크기라고하셧는데</p>
<p></p>
<p>main-message의 부모는 html아닌가요? ㅠㅠ&nbsp;</p>
<p></p>
<p>rem:html폰트사이즈</p>
<p>em: 현재 부모의 폰트사이즈 기준&nbsp;</p>
<p></p>
<p>이렇게 알고있었는데</p>
<p>em은 요소 자신의 폰트사이즈에 비례해서 크기가 정해지는건가요?</p>

<p>자신의 폰트사이즈가 설정되어있지 않을 경우,<br />결국 부모의 폰트 사이즈가 내 폰트사이즈가 되므로<br />보통 부모의 폰트 사이즈가 기준이 되는게 맞는데요~<br />이 경우에는 자기 폰트사이즈가 설정이 되었으므로<br />2.5rem의 3배가 된다고 생각하시면 됩니다^^</p>

인프런 커뮤니티 질문&답변

오마갓.. 정리하다가 헷갈립니다.