Bootstrap中心對齊方式不正確

-1

我正在嘗試創建一個<div>，它在瀏覽器中顯示9列，並且水平顯示適當的寬度和高度，但當前顯示的<div>正確且正確對齊，但未居中。Bootstrap中心對齊方式不正確

這是我的代碼：

<div class="row"> 
    &nbsp; 
    <div class="col-lg-offset-2 col-lg-1 col-md-6 col-xs-6 col-sm-4" style="margin-top: 10px;"> 
    </div> 
    <div class=" col-lg-1 col-md-6 col-xs-6 col-sm-4" style="margin-top: 10px;"> 
    </div> 
    <div class=" col-lg-1 col-md-6 col-xs-6 col-sm-4" style="margin-top: -11px;"> 
    </div> 
    <div class=" col-lg-1 col-md-6 col-xs-6 col-sm-4" style="margin-top: 10px;"> 
    </div> 
    <div class=" col-lg-1 col-md-6 col-xs-6 col-sm-4" style="margin-top: 13px;"> 
    </div> 
    <div class=" col-lg-1 col-md-6 col-xs-6 col-sm-4" style="margin-top: 12px;"> 
    </div> 
    <div class=" col-lg-1 col-md-6 col-xs-6 col-sm-4" style="margin-top: 13px;"> 
    </div> 
    <div class=" col-lg-1 col-md-6 col-xs-6 col-sm-4" style="margin-top: 16px;"> 
    </div> 
    <div class=" col-lg-1 col-md-6 col-xs-6 col-sm-4" style="margin-top: 16px;"> 
    </div> 
</div>

誰能幫助我？

來源

2015-04-16 alexpandiyan

Sidenote following edit：請記住代碼要正確顯示，它必須從左側至少縮進4個空格。或者，突出顯示您的代碼並按下「{}」按鈕以自動縮進它。 –

你知道在bootstrap中列的總數不應該超過12個嗎？您的中等和超小行有54列。 – j08691

您可以使用「偏移」類http://getbootstrap.com/css/#grid-offsetting

但由於9不平分到12（即無法通過COL-MD-1.5偏移），你可以更好地創造抵消引導列你在.container/.row/.col-md-12（無論你根據你的佈局要求決定）中將自己的div類設置爲最大寬度爲75％ - 顏色僅僅是爲了舉例。

.container { 
 
    border: 1px solid red; 
 
} 
 
.mynewdiv { 
 
    max-width: 75%; 
 
    margin: 0 auto; 
 
    background-color: blue; 
 
    color: white; 
 
}

<div class="container"> 
 
    <div class="mynewdiv"> 
 
    <p>75% width div here</p> 
 
    </div><! --/.mynewdiv --> 
 
</div><!-- /.container -->

來源

2015-04-16 18:53:40 AnnieMac

從我的理解，請檢查該解決方案可幫助您

https://jsfiddle.net/akshaybhende/DTcHh/6730/

請增加fidddle屏幕寬度和支票的演示將是小和LG網不適用。

<div class="row"> 
    <div class="col-lg-10 col-lg-offset-1 center-div"> 

    <div class="col-sm-4 inner"> 
     <div class="col-lg-4 col-md-6 col-xs-6 col-sm-4" style="margin-top: 10px;">1 
    </div> 
    <div class=" col-lg-4 col-md-6 col-xs-6 col-sm-4" style="margin-top: 10px;">2 
    </div> 
    <div class=" col-lg-4 col-md-6 col-xs-6 col-sm-4" style="margin-top: -11px;">3 
    </div> 
     </div> 

    <div class="col-sm-4 inner"> 
    <div class=" col-lg-4 col-md-6 col-xs-6 col-sm-4" style="margin-top: 10px;">4 
    </div> 
    <div class=" col-lg-4 col-md-6 col-xs-6 col-sm-4" style="margin-top: 13px;">5 
    </div> 
    <div class=" col-lg-4 col-md-6 col-xs-6 col-sm-4" style="margin-top: 12px;">6 
    </div> 

     </div> 

    <div class="col-sm-4 inner"> 

    <div class=" col-lg-4 col-md-6 col-xs-6 col-sm-4" style="margin-top: 13px;">7 
    </div> 
    <div class=" col-lg-4 col-md-6 col-xs-6 col-sm-4" style="margin-top: 16px;">8 
    </div>

來源

2015-04-16 19:32:04 LegendaryAks

Bootstrap中心對齊方式不正確

回答

相關問題