與Twitter的引導我如何有選擇地堆列

Question

我有一個基於流體例如這裏的模板： http://twitter.github.io/bootstrap/examples/fluid.html

我從這裏有最新的文件，唯一的定製是顏色： http://twitter.github.io/bootstrap/customize.html

基本標記爲

<div class="container-fluid"> 
    <div class="row-fluid"> 
    <div class="span3"> 
     <div class="well sidebar-nav"> 
    Column 1 
     </div><!--/.well --> 
    </div><!--/span--> 
    <div class="span9"> 
    Column 2 
    </div><!--/span--> 
    </div><!--/row--> 
</div> 

第2列屬於移動設備的第1列，這是我想要的。但在某些情況下（特定頁面），我希望2列保持並排。我的問題是如何使用相同的js/css文件實現這一目標？

Answer 1

這裏有一個可能性：http://jsfiddle.net/panchroma/RMPMA/

您將看到列不就行落帶class =雙山坳
CSS

@media (max-width: 767px){ 
.double-col.row-fluid [class*="span"] { 
float: left; 
width: 50%; 

} 
} 

因爲這重置每個關口的寬度在視點767px及以下的情況下爲50％，這將適用於有兩列的行。對於其他組合，只需使用寬度設置進行播放。您可能還想要優化填充和其他樣式，但現在已經夠簡單了。

希望這會有所幫助！