0

最近ダウンロードしたブートストラップを使用してサイトのデザインを作成しています

試してみましたが、コンテナ div が画面の中央rowに配置されていません。span12私は58cmのLEDモニターを使用しています（中央に見えません）。

DIV 幅は 1170px (Firebug) を示しており、940px であると想定されています。

ここで私のデザインをチェックしてくださいhttp://rentbbsr.com/projects/daycare/

こんな感じですhttp://rentbbsr.com/projects/daycare/daycare.jpeg

ヘッダーを固定して中央に配置したいだけです。

4

1 に答える 1

1

たくさんの理由があります。行に負の左マージンがあります。

@media (min-width: 1200px)
    .row {
        margin-left: -30px;
    }
}
.row {
    margin-left: -20px;
}

次に、スパンに別のマージンがあります。

@media (min-width: 1200px)
    [class*="span"] {
         float: left;
         min-height: 1px;
         margin-left: 30px;
}

class*="span"] {
       float: left;
       min-height: 1px;
       margin-left: 20px;
}

次に、中央に配置したコンテナが内容よりも幅が広くなっています。幅が広いため、その要素は中央に配置されますが、空の領域があります。ツリーのグラフィックや下のメニューなど、中央に配置したいものの幅に設定すると、実際には中央に配置されます。

この場合、上部のグラフィックの幅に設定します:

.container, .navbar-static-top .container, .navbar-fixed-top .container, .navbar-fixed-bottom .container {
width: 988px;
}

メディアクエリにも設定することを忘れないでください。

要約すると、ラッパー要素はコンテンツよりも幅が広く、幅をさらに調整するさまざまなマージンがいたるところにあります。それらを削除して正しい幅を設定すると、期待どおりに中央に配置されます。

于 2013-05-16T23:04:51.737 に答える