0

ブートストラップを使用してページレイアウトを作成していますが、コンテンツは常に右よりも少し左にあります。行クラスに-20pxのマージンが残っていることに気付きました。これが問題の原因であると私は信じていますが、確かにそれは正しくありませんか?

これが私のマークアップです:

<div class="row header-wrap">
    <div class="container header">
        <div class="row">
            <div class="span6">
            test
            </div>
            <div class="span6">
            test
            </div>
        </div>
    </div>
</div>

ところで、ヘッダーとヘッダーラップはまだ定義されていません。

外側の行divの目的は、後でヘッダーの継続的な背景を作成することです。


ここに画像の説明を入力してください

4

2 に答える 2

0

問題が発生しました。.row2回使用しています。ここから削除.rowします:

<div class="row header-wrap">

そしてそれをする:

<div class="header-wrap">

.header-wrapまた、の代わりに背景色を指定し.containerます。

jsFiddleで出力を参照してください

于 2013-03-05T10:27:05.453 に答える
0

親divなしで行divを使用するのはなぜ悪い考えですか?

行クラスの左側に-20pxの負のマージンがあるため、コンテンツを中央に配置することはできません。行に適用されるスタイルは常に左側に流れ、そのため、その中の要素は中央に配置されません。 。したがって、親としてその周りのdivを使用すると、問題が解決します。行クラスの使用方法は、間違った使用方法です。

次の方法でデザインを実装できます:Jsfiddle Demo

<header>
<div class="container">

        <div class="row">
        <div class="span6">
        test
        </div>
        <div class="span6">
        test
          </div>

    </div>
   </div>
</header>
于 2013-03-05T11:00:25.253 に答える