CSS 높이 차이 : 100 % vs 높이 : 자동

CSS 높이 차이 : 100 % vs 높이 : 자동

---

나는 "무엇은 CSS의 차이라고 인터뷰에서 질문을했다 height:100%하고 height:auto?"

아무도 설명 할 수 있습니까?

---

height:100% 요소의 부모 컨테이너 높이가 100 %임을 나타냅니다.

height:auto 즉, 요소는 유연한 높이를가집니다. 즉, 높이는 하위 요소의 높이에 따라 달라집니다

아래 예를 고려하십시오.

높이 : 100 %

<div style="height:50px">
    <div id="innerDiv" style="height:100%">
    </div>
</div>

#innerDiv ~ 할 것이다 height:50px

높이 : 자동

<div style="height:50px">
    <div id="innerDiv" style="height:auto">
          <div id="evenInner" style="height:10px">
          </div>
    </div>
</div>

지금은 #innerDiv해야 할 것입니다height:10px

---

100 %의 높이 에 대한이며, 아마도, 당신의 높이 브라우저의 창 안쪽 은 IS 그 때문에, 부모의 높이 페이지. auto높이 될 것입니다 최소 높이 의 포함 할 필요 .

---

기본값은 height: auto브라우저에 있지만 height: X%높이를 포함하는 블록의 백분율로 정의합니다.

---

height : 100 %는 부모 컨테이너에 지정된 height 속성이 있으면 작동하지 않습니다.

참고 URL : https://stackoverflow.com/questions/15943009/difference-between-css-height-100-vs-height-auto