2017-01-09 9 views
-1

私のブートストラップの行にマイナスのマージンがあり、私のページを台無しにしています(私は水平にスクロールすることはできません)。ブートストラップの行は常にコンテナを親として持つ必要がありますか?この問題をどのようにして止めるのですか?私はそれをたくさん走ります。ブートストラップ行は常にコンテナを親として必要としますか?

これを正しくフォーマットするにはどうすればよいですか?

<div class="container"> 
    <div class="row"> 
     <div class="col-md-8"> 
      <div class="row row-one"> 
       ...stuff... 
      </div> 
      <div class="row row-two"> 
       ...stuff... 
      </div> 
     </div> 
     <div class="col-md-4> 
      ...stuff... 
     </div> 
    </div> 
</div> 

そうでしょうか?

<div class="container"> 
    <div class="row"> 
     <div class="col-md-8"> 
      <div class="container"> ** CONTAINER HERE? ** 
       <div class="row row-one"> 
        ...stuff... 
       </div> 
       <div class="row row-two"> 
        ...stuff... 
       </div> 
      </div> 
     </div> 
     <div class="col-md-4> 
      ...stuff... 
     </div> 
    </div> 
</div> 
+4

"行は適切な整列とパディングのために.container(固定幅)または.container-fluid(全幅)内に配置する必要があります。 http://getbootstrap.com/css/#grid –

+0

ブートストラップのデフォルトの「行」クラスは左右に15pxのネガティブパディングを持ち、「コンテナ」クラスの両側には15pxのパディングがあります。したがって、この横スクロールの問題を解決するには、ブートストラップの「行」クラスの親として常に「continer」を使用する必要があります。 –

+0

ブートストラップのデフォルトの「行」クラスには15pxの「マージン」があります。以前のコメントに誤りがありました。私はそれが否定的な "パディング"をしていると述べました。 –

答えて

0

は、私はあなたがブートストラップのレイアウトがどのように機能するか明確なアイデアを得ることができることから、このDocumentationを読むべきだと思います。彼らは言及している方法で特定のCSSを使用する必要が来る良いを得るために、ブーストラップフレームの仕事を使用する方法があります。

1

通常、ブートストラップ行は常に-15pxのマージンを持ち、コンテナの左右には15pxのパディングがあります。コンテナと行を使用すると、この合計はゼロになり、この種の問題を取り除きます。ブートストラップのドキュメントからグリッドシステムを読み込みます。