0

幅 x1 と高さ y1 の div を、それぞれ幅 x2 と高さ y2 の他の div 要素で自動的に埋める方法を探しています

したがって、html は次のようになります。

<div class="parentdiv">
    <div class="subdiv"></div>
    <div class="subdiv"></div>
    <div class="subdiv"></div>
    ...
</div>

すべての情報を表示するために必要なサブディビジョンの数に基づいて、サブディビジョンが動的に追加されます。私は彼らがparentdivのスペースを水平に埋めてから、端にぶつかったときに次の行に移動したいと思っています。

現在、それらは垂直に積み重ねられているだけで、多くの無駄なスペースがあります。これに対するクロスブラウザ ソリューションはありますか?

4

2 に答える 2

2 
<style type="text/css">
    .parentdiv .subdiv { display: inline-block; }
</style>

IE7 では div のインライン化に問題があるため、これらのサブディビジョン、サブスパンを作成する必要がある場合があります (まだ を使用inline-block)。

またはブライアンのソリューションfloat:left;

于 2012-04-19T19:35:49.777 に答える
1

デフォルトでは、div はその親コン​​テナーの幅全体を占有します。float: leftクラスに aを追加することで、これを修正できますsubdiv。コンテナの最後にあるフロートを必ずクリアしてください。このようなもの：

<style type="text/css">
.parentdiv .subdiv { float: left; }
</style>

<div class="parentdiv">
    <div class="subdiv"></div>
    <div class="subdiv"></div>
    <div class="subdiv"></div>
    ...
    <div style="clear: both;"></div>
</div>
于 2012-04-19T19:31:31.370 に答える