Bootstrap2容器最大宽度

我需要建立一个页面，其中有max-width:750px; .container我还需要具有生成的.span4几行只是通过向同一.rowBootstrap2容器最大宽度

如果我添加max-width到.container那么.span s停止正常运行。如果我使用.row-fluid，我可以得到正确的列宽，但是在第一行上他们排列正确，第二行没有。

<style> 
.container { max-width:750px;} 
</style> 

<div class="container"> 
    <div class="row"> 
     <div class="span4" style="background-color:#F00">1</div> 
     <div class="span4" style="background-color:#9F0">2</div> 
     <div class="span4" style="background-color:#FF0">3</div> 
     <div class="span4" style="background-color:#939">4</div><!-- make new row --> 
     <div class="span4" style="background-color:#3CF">5</div> 
     <div class="span4" style="background-color:#F00">6</div> 

    </div> 
</div> 



<div class="container" style="margin-top:50px"> 
    <div class="row-fluid"> 
     <div class="span4" style="background-color:#F00">1</div> 
     <div class="span4" style="background-color:#9F0">2</div> 
     <div class="span4" style="background-color:#FF0">3</div> 
     <div class="span4" style="background-color:#939">4</div><!-- make new row --> 
     <div class="span4" style="background-color:#3CF">5</div> 
     <div class="span4" style="background-color:#F00">6</div> 

    </div> 
</div>

我明白12列CSS栅格bootstrap的逻辑。问题不在于我的跨度加起来还不到12

LIVE PREVIEW HERE

有人吗？

来源

2013-10-01 no0ne

这个问题发生在我身上一次。我不知道如何修复它，我只是添加了设置margin-left的类（或样式）：0;到每行的第一个跨度。 – Chokchai

@ ch.smrutiranjanparida，FYI，看起来像你忘了包括bootstrap 2。 – Chokchai

这是因为除了第一个行以外的每个跨度需要margin-left。要解决此问题，请使用自定义CSS从第四个跨度中删除margin-left，或者您可以为每一行分别设置行类。我建议每行都有单独的行比较好，但这是你的决定。

我的建议是：

<div class="container"> 
    <div class="row-fluid"> 
     <div class="span4" style="background-color:#F00">1</div> 
     <div class="span4" style="background-color:#9F0">2</div> 
     <div class="span4" style="background-color:#FF0">3</div> 
    </div> 
    <div class="row-fluid"> 
     <div class="span4" style="background-color:#939">4</div><!-- make new row --> 
     <div class="span4" style="background-color:#3CF">5</div> 
     <div class="span4" style="background-color:#F00">6</div> 
    </div> 
</div>

来源

2013-10-01 09:43:21

Bootstrap2容器最大宽度

回答

相关问题