부모 div를 자식 div만큼 넓게 만들려고합니다. 자동 너비는 상위 div를 전체 화면에 맞게 만듭니다. 자식 div는 내용에 따라 너비가 다르므로 그에 따라 조정하려면 부모 div가 필요합니다.
<div style='width:auto;'>
<div style="width: 135px; float: left;">
<h4 style="padding-right: 5px; padding-left: 15px;">Column1</h4>
<dl style="padding-right: 5px; padding-left: 15px; margin-top: -8px; overflow-x: hidden;">
<dd style="white-space: nowrap;">1</dd>
<dd style="white-space: nowrap;">2</dd>
</dl>
<h4 style="padding-right: 5px; padding-left: 15px;">Column1</h4>
<dl style="padding-right: 5px; padding-left: 15px; margin-top: -8px; overflow-x: hidden;">
<dd style="white-space: nowrap;">1</dd>
<dd style="white-space: nowrap;">2</dd>
</dl>
</div>
<div style="width: 135px; float: right;">
<h4 style="padding-right: 5px; padding-left: 10px;">Column2</h4>
<dl style="padding-right: 5px; padding-left: 15px; margin-top: -8px; overflow-x: hidden;">
<dd style="white-space: nowrap;">1</dd>
<dd style="white-space: nowrap;">2</dd>
<dd style="white-space: nowrap;">3</dd>
</dl>
</div>
</div>
답변
인테리어 <div>
요소는 둘 다 float:left
. 컨테이너 너비의 크기를 자동으로 100 %로 나눕니다. 컨테이너 div display:inline-block
대신 사용하십시오 width:auto
. 또는 float:left
용기와 함께 적용 할 수도 있습니다 overflow:auto
. 정확히 무엇을 추구하는지에 따라 다릅니다.
답변
상위 div (가장 바깥 쪽 div라고 가정)는 display: block
컨테이너 (이 경우 본문)의 사용 가능한 모든 영역을 채울 수 있습니다. 다른 디스플레이 유형을 사용하십시오 inline-block
.