2014-09-13 3 views
2

내가이 부트 스트랩 그리드를 확장 :부트 스트랩 그리드 행 높이 오프셋은

내가 왼쪽에 8 COL 공간을두고, 다음 같은 행에서 오른쪽에 두 이미지 모두를 갖고 싶어
<div class="row"> 
    <div class="col-md-2 col-md-offset-8"> 
     <img src="img/photo1.jpg" class="img-responsive"> 
    </div> 
    <div class="col-md-2 col-md-offset-10"> 
     <img src="img/photo2.jpg" class="img-responsive"> 
    </div> 
</div> 

. 하지만 위의 코드는 첫 번째 사진의 오른쪽 하단 두 번째 사진을 배치합니다. 따라서 행 높이가 두 배가됩니다.

어떻게 해결할 수 있습니까?

답변

4

두 번째 사진의 래퍼에서 오프셋을 제거하기 만하면됩니다. 부트 스트랩에서 열의 총계는 최대 12 개가되어야하지만, 2 + 8 = 10, 다시 2 + 8 = 10, 총 20입니다. 따라서 행을 점프합니다. 당신이 2 번째 이미지에서 오프셋을 제거하는 경우, 그것은 잘 다른 이미지 옆에 자신을 배치해야합니다, 그것은 것 2 + 8 여기서 = 12

<div class="row"> 
    <div class="col-md-2 col-md-offset-8"> 
     <img src="img/photo1.jpg" class="img-responsive"> 
    </div> 
    <div class="col-md-2"> 
     <img src="img/photo2.jpg" class="img-responsive"> 
    </div> 
</div> 

+ 2는 데모입니다 : http://www.bootply.com/gVhppNNe7M

+0

감사합니다 당신!!!!! 그것은 효과가 있었다 : D – phoeberesnik

+0

행복하게 도울 수 있었다! ;) – webeno