2
.containerdiv{
white-space: nowrap;
}

.childdiv{
display : inline-block;
}

<div class="containerdiv">
   <div id="child1" class="childdiv"></div>
   <div id="child2" class="childdiv></div>
</div>

子divをラップしたくありません。したがって、上記のようにcssを作成しました。

div「child1」では、さまざまな場所で異なる幅を指定します。div child2 がコンテナーを超えないようにするには、child2 の最大幅を指定します。すなわち。親div以下。(計算して置くことはできません)どうすればこれを達成できますか。私が見ることができるのは、div child2 が親コンテナーよりも出ていることです。これを防ぐ方法は?

助けてください。前もって感謝します。

4

1 に答える 1

0

非常に満足したい場合は、インラインブロックを実行して、最善を尽くすことができます.

しかし、コンテンツが広すぎる場合、インラインブロックを次の行にプッシュするだけかもしれません

ソリューション

#containerdiv {overflow:auto;}/*the clear fix*/
#containerdiv>div {float:left; width:50%;}

そこでは、両方ともコンテナーの 50% を占め、オーバーフローの自動クリアで修正されます。

50% でインライン ブロックを実行できますが、水平方向の空白を破棄する必要があります。

<div><div></div></div>

それらの間に空白がないため、これは機能します

<div>
<div></div><!--
--><div></div>
</div>

コメントによって空白が削除されるため、これは機能します。

于 2013-09-25T18:33:12.383 に答える