중첩 된 div 너비는 상위 스크롤 가능한 div의 스크롤 막대에서 멈 춥니 다

Question

기본적으로 중첩 된 콘텐츠가있는 기본 컨테이너 div가 있습니다. 이 div에는 동적 너비가 있으며 페이지의 크기가 조정됩니다.

이제이 div에는 항목 목록이 있습니다. 모든 항목은 너비가 고정되어 있으며 컨테이너 div (오버플로 : 자동)를 확장 할 수 있기를 원합니다. 내 목록을 display : block으로 설정하면 컨테이너의 너비가 100 %가됩니다. 그러나 가로 스크롤 막대를 강제하는 많은 목록 항목이있는 경우 차단 목록은 컨테이너 스크롤 막대에서 중지되고 목록 항목은 계속 전달됩니다. 여기

은 예입니다 http://jsfiddle.net/9tjZz/4/

어떻게 차단 목록의 항목이 할 컨테이너 목록의 스크롤을 통과 확장 할 수 있습니까?

Answer 1

이 문제를 해결하기 위해 clearfix를 사용할 수 있습니다. 컨테이너에 clearfix 클래스를 추가하고 적절한 CSS를 추가하기 만하면됩니다.

.clearfix:after { 
     content: "."; 
     display: block; 
     clear: both; 
     visibility: hidden; 
     line-height: 0; 
     height: 0; 
    } 

    .clearfix { 
     display: inline-block; 
    } 

    html[xmlns] .clearfix { 
     display: block; 
    } 

    * html .clearfix { 
     height: 1%; 
    } 

그리고 필요한 경우 다음 class="clearfix"을 추가

http://jsfiddle.net/9tjZz/5/

이 당신이 필요로하는 CSS는 다음은 작업 예입니다. 귀하의 경우, 그것은 컨테이너입니다.