2014-10-09 4 views
13

여러 개의 열 (동적이 없으면 최대)을 가져 와서 가로 스크롤을 얻으려고합니다.가로 스크롤이있는 부트 스트랩 행

부트 스트랩 크기 12를 초과하는 새 열을 삽입 할 때 해당 열을 새 줄로 가져옵니다. 내가 원하는 것은 같은 줄에 그 열을 보존하고 가로 스크롤보기를 얻는 것입니다. "와 div의 내부 스타일 속성이 필요합니다;"파라미터 nowrap 공백 "

이 같은 뭔가 이미 시도했지만 작동하지 않았다 ...

<div class="span11" style="overflow: auto"> 
    <div class="row-fluid"> 
     <div class="col-lg-3">COL1</div> 
     <div class="col-lg-3">COL1</div> 
     <div class="col-lg-3">COL1</div> 
     <div class="col-lg-3">COL1</div> 
     <div class="col-lg-3">COL1</div> 
     <div class="col-lg-3">COL1</div> 
     <div class="col-lg-3">COL1</div> 
    </div> 
</div> 

답변

21

행 유체가 스타일 속성을 필요 디스플레이 : 인라인 블록; "

.row-fluid{ 
    white-space: nowrap; 
} 
.row-fluid .col-lg-3{ 
    display: inline-block; 
} 

try it

5

큰 화면에는 float: none;col-의 클래스가 필요합니다.

.row-fluid { 
    overflow: auto; 
    white-space: nowrap; 
} 

.row-fluid .col-lg-3 { 
    display: inline-block; 
    float: none; 
}