Bootstrap中的背景色泄漏到页边距

Question

我在bootstrap上遇到了这个问题，我试图在2个.span6 div上设置背景色，但背景泄漏到了左边的空白处。

​

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

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

这里是.feature-post div的css。

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

Answer 1

使用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>

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