2014-07-27 4 views
0

내 화면의 100 %가 넘는 유체 용기가 필요합니다. 문제는 전체 폭이 100 %보다 커지도록 각 열에 대해 패딩을 부트 스트랩하는 것입니다. 모든 열에 "패딩이없는"클래스를 추가하면 작동하지만 올바른 해결책이 될 수 없습니까?Container-Fluid에는 각면에 약간의 여백이 있습니다.

이상한 점은 내 jsFiddle에서 제대로 작동한다는 것입니다. 내 프로젝트에서

jsFiddle

: 내 프로젝트되지에서

<div id="section1"> 
    <div class="container-fluid"> 
     <div class="row"> 
      <div class="col-lg-2">test</div> 
      <div class="col-lg-2">test</div> 
      <div class="col-lg-2">test</div> 
      <div class="col-lg-2">test</div> 
      <div class="col-lg-2">test</div> 
      <div class="col-lg-2">test</div> 
     </div> 
    </div> 
</div> 

#section1 { 
    max-width: 100%; 
} 

은 다음과 같습니다

.container-fluid { 
    padding-left: 0; 
    padding-right: 0; 
} 

:

+0

텍스트를 브라우저 창의 측면에 맞게 올리시겠습니까? – DavidG

+0

예. 패딩이없는 모든 열 – Michael

+0

아마도 - http://jsfiddle.net/CCYLe/1/ – URL87

답변

3

enter image description here 그냥 제로 패딩 container-fluid에 추가 이처럼 :

http://jsfiddle.net/5xWp5/3/

참고 원하는대로 오른쪽에 적용했습니다.

+0

나는 당신이 제안한 것을 시도해 보았지만 효과가 없었지만 컨테이너 - 유체 클래스가 아닌 것을 알았다. 이 이상한 오프셋을 만드는 행 클래스입니다. 아직도 고마워요 :) – Michael

+0

정확하게 작동하지 않는 것은 무엇입니까? 'container-fluid'는 15px 패딩을,'row'는 15px를 제거하고'col- * '는 15px를 더합니다. 그래서 만약 당신이 그것을'container-fluid'에서 제거한다면, 그것은 균형을 이룹니다. – DavidG

+0

정확히 왜 그런지 모르겠지만 행은 h 스크롤바를 만든 오른쪽에 이상한 오프셋을주었습니다. .row { 패딩 : 0; 여백 : 0; } . 용기 유체 { 패딩 : 0; 여백 : 0; } . 용기 - 유체 [클래스^= "col"] { 패딩 : 0; 여백 : 0; } 원하는 결과를 얻었습니다. – Michael

관련 문제