0

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>

そして、これが.featured-postdivのcssです。

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

1 に答える 1

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の幅が与えられます。

于 2013-01-22T18:34:31.557 に答える