em

em 단위는 부모 요소의 텍스트 크기(font-size)를 기준으로 상대적인 크기를 가집니다. % 단위는 사용되는 속성에 따라 기준이 달라지지만, em 단위는 오로지 텍스트 크기를 기준으로 삼습니다. 만약 값을 2em으로 지정했다면 자식 요소의 크기는 부모 요소의 font-size 속성값의 2배가 됩니다.

.parent{
  font-size:16px;
}
.child{
  font-size:2em; /* 16px(부모 font-size 크기) * 2em = 32px */
}
.child-to-child{
  font-size:2em; /* 32px(부모 font-size 크기) * 2em = 64px */
}