Worth spreading

[css] parent의 높이를 child의 높이에 맞추기 본문

Web programming/html&css

[css] parent의 높이를 child의 높이에 맞추기

annual 2018. 7. 29. 20:07 


<body>
  <div id="parent">
    <div id="childRightCol">
      /*Content*/
    </div>
    <div id="childLeftCol">
      /*Content*/
    </div>
  </div>
</body>


위와 같은 예제에서 child의 height이 커지면 parent의 height도 따라서 커지게 하고 싶은 경우가 있을 것이다.


이 때 parent의 style에

overflow:auto;

를 추가해주면 된다.


한 가지 방법이 더 있는데

Parent:

display: table;

Child:

display: table-row;


이렇게 각각 스타일을 지정해주면 된다.



출처: https://stackoverflow.com/questions/384145/expanding-a-parent-div-to-the-height-of-its-children

'Web programming > html&css' 카테고리의 다른 글

prevent bounce on scroll  (0) 2018.10.30
[css] display: inline 사이즈 조절 문제  (0) 2018.07.29
[css] 박스 가운데정렬하기  (0) 2018.07.29
[css] 화면 크기 조정시 박스들의 위치가 바뀌는 문제  (0) 2018.07.29
'Web programming/html&css' Related Articles more
Comments