28

私が持っている場合：

<div class="container-fluid">
   <div class="row-fluid">
      <div class="span8">
             Some Element....
       </div>
       <div class="span4">
             Other Element
       </div>   
   </div>       
</div>

このコードを使用すると、ウィンドウの左右の境界からある程度のマージンがあります。これらのマージンをどのように排除できますか？

ご協力ありがとうございました

4

2 に答える 2

36

私があなたの質問を正しく理解しているなら、私はあなたがこれを望んでいると信じています：

.container-fluid {
    padding: 0px;
}

また、レスポンシブブートストラップを使用している場合は、次のことも必要になります。

@media (max-width: 797px) {
    body { 
        padding-left: 0px;
        padding-right: 0px;
    }
}

編集：ここにjsフィドルがあります。

于 2013-01-18T21:28:28.317 に答える
9

表示されている効果は、containerのパディングによるものです。

組み込みのBootstrap4スペーシングユーティリティクラスcontainerを使用して、のデフォルトのパディングを変更できます。

パディングを削除するには、：に追加しp-0ます。container

<div class="container-fluid p-0">
    <div class="row">
      <div class="col-8">
         Some Element....
       </div>
       <div class="col-4">
          Other Element
       </div>   
    </div>       
</div>

組み込みのユーティリティクラスを使用すると、CSSを無駄のない状態に保つことができ、デフォルトcontainer-fluidのクラス定義も変更されません。

于 2019-02-08T09:20:14.163 に答える