爲什麼Span跨入Bootstrap

Question

我試圖使用bootstrap製作一個網站。當我嘗試在主內容區域[Span5，Span5和Sidebar Span2]中添加一些跨度時，邊欄突破並進入下一行 我附加了CSS和瀏覽器預覽。

這將是很好，如果有人幫我在這方面

CSS代碼：

<div class="container"> 

    <div class="content-box"> 

    <div class="row"> 
    <div class="span12"> 
     <div class="span5"> 
     Column1 
     </div> 
     <div class="span5"> 
     Column2 
     </div> 
     <div class="span2"> 
     Sidebar 
     </div> 

    </div> 
    </div><!-- End of "Row" --> 

</div><!-- End of "Content Box" --> 

</div><!-- End of "Container" --> 

非常感謝

Teekeybee

Answer 1

隨着Bootstrap2，你需要一個row類來包裝你的嵌套span S：

<div class="container"> 
    <div class="content-box"> 
     <div class="row"> 
      <div class="span12"> 
       <div class="row"><!-- row for nested spans --> 
        <div class="span5">Column1</div> 
        <div class="span5">Column2</div> 
        <div class="span2">Sidebar</div> 
       </div> 
      </div> 
     </div> 
    </div> 
</div> 

在你的情況，我覺得你span12是沒用的，所以我建議：

<div class="container"> 
    <div class="content-box"> 
     <div class="row"> 
      <div class="span5">Column1</div> 
      <div class="span5">Column2</div> 
      <div class="span2">Sidebar</div> 
     </div> 
    </div> 
</div> 

取看看文檔（「嵌套列」部分）：http://getbootstrap.com/2.3.2/scaffolding.html#gridSystem

希望這有助於！

Answer 2

如果您使用引導3 +，那麼span1，span2不再有效。請仔細閱讀他們的文檔：http://getbootstrap.com/css/#grid-options

我不熟悉w/bootstrap 2.3，但這是爲了防止您使用版本3+。