Bootstrap中的背景颜色泄漏到边缘

时间:2013-01-22 18:27:43

标签: twitter-bootstrap

我在引导程序中遇到这个问题,我试图在2 .span6 div上设置背景颜色,但背景正在泄漏到左边的边距。

http://f.cl.ly/items/051D1b2R031W3P472E10/Screen%20Shot%202013-01-22%20at%2017.38.09.png

有什么方法可以防止这种情况发生?以下是使用的HTML。

<div class="row">
        <div class="featured-post">
            <div class="span6">
                <!-- thumbnail image here -->
            </div>
            <div class="span6">
                <!-- text here -->
                </div>
            </div>
 </div>

这是.featured-post div的css。

.featured-post {
  margin-bottom: 15px;
  background-color: rgba(0, 0, 0, 0.5);
  min-height: 320px;
}

1 个答案:

答案 0 :(得分:0)

使用firebug / chrome开发人员工具,你会看到。

@media (min-width: 1200px)
[class*="span"] {
float: left;
min-height: 1px;
margin-left: 30px;
}

左边距正在创造额外的空间。

你可以通过这样放置div来避免这些边距:

<div class="featured-post">
   <div class="row">
      <div class="span6">
         <!-- thumbnail image here -->
      </div>
      <div class="span6">
         <!-- text here -->
      </div>
   </div>
</div>

这为.featured-post提供了.container的宽度。