0

Gumby フレームワークを使用すると、div をネストする際に問題が発生します。

10 列のグリッド内に 3 列と 7 列のグリッドを入れ子にしようとしています。

HTML/CSS でいくつかのバリエーションを試してみましたが、役に立ちませんでした。図 かなり単純なものが欠けているに違いありません。

サイト リンク

HTML コード例:

 <div class="ten columns main_col">
 <p>Text removed</p>

 <div class="row">
 <div class="three"><h2 class="100width">Core Services</h2></div>
 <div class="seven"></div>
 </div>

 </div>
4

1 に答える 1

4

フレームワークは「スマート」ではありません。すべてが12列または16列に基づいています。ですから、あなたはこの性質のものについてすべての考えをしなければなりません。12列のグリッド内に3〜7の中央に配置されたコンテナが必要な場合は、次のコードでそれを実行できます。

<!-- 10 Columns -->
<div class="row">
    <div class="three columns push_one">3 col</div>
    <div class="seven columns">7 col</div>
</div>
<!-- // End 10 -->

その理由は次のとおりです。10列=12の10（引数のため）、そのコンテナー内の3列と7列は、実際には12列の30％であり、12列のコンテナーの83.333％内にある12列の70％の隣にあります。コンテナをスローclass="ten columns"しても、コンテナを10列のグリッドシステムとして「リセット」するためのある種の再帰関数は実行されません。したがって、間抜けなマージン、パディングなど。実際には期待どおりに機能しています。それが理にかなっていることを願っています。

于 2013-01-24T22:27:55.427 に答える