0

Twitter Bootstrap を使用して非常に基本的なレイアウトを作成しました。

<body>
<div class="container">

    <!-- Navbar -->
    <div class="navbar">
        <div class="navbar-inner">
            ...
        </div>
    </div>

    <!-- Carousel -->
    <div class="row">
        <div class="span12">
            <div id="myCarousel" class="carousel slide" >
                ...
            </div>
        </div>
    </div>

    <!-- the content -->
    <section id="first_sect">
        <div class="row  alpha07">
            <div class="span12">
                <h1>header</h1>
                <p>Lorem ipsum dolor sit amet...</p>
            </div>
        </div>
    </section>

    <!-- whitespace row -->
    <div class="row  alpha07">
        <div class="span12">
            &nbsp; 
        </div>
    </div>

    <!-- adress footer -->
    <section id="adress section">
        <div class="row  alpha07">...
        </div>
    </section>
    <!-- End of Bootstrap Container -->
</div>
</body>

そして、行の水平方向の配置と幅の問題があります。画像はこれをよりよく示しています: ここに画像の説明を入力

  • 赤い背景が左に行き過ぎている
  • 右側にパディングなし

Bootstrap は変更なしでそのまま使用できます。ページ コード: http://jsfiddle.net/thomson256/DMnhL/10/ Twitter ブートストラップ バージョン 2.2.2

質問は次のとおりです。これは何らかのバグですか、それともラッピング html 要素または .less 変数への変更が欠落しているだけですか?

4

1 に答える 1

1

これは、私が見る限り、期待どおりに機能しています。コンテンツ領域の内部ラッピング div を追加し、そこに CSS を適用します。

.inner {
  padding: 2em;
  background: rgba(150, 50, 50, 0.7);
}

ここにフォークがあります: http://jsfiddle.net/gyf6c/1/。

于 2013-01-15T22:08:15.113 に答える