2

ネストされた div の子に親コンテナーの幅を埋めるように強制することに関しては多くの質問がありますが、私の質問は、親コンテナーよりも大きい自然なフロー幅で子 div を強制する方法です (たとえば、子 div親の幅を維持するために、親コンテナの幅を超えて子を引き延ばすテキストノードが含まれていますか?

動的ではない単純な解決策は、親に幅を設定することですが、幅が事前に決定されていない場合 (応答上の理由から) はどうでしょうか? 子要素に追加して、コンテンツをラップし、要素が親の幅内に収まるようにするためのタグはありますか?

<div class="parent"> //Width is not set
    <div class="child">Here might be a long string of dynamic text</div>
</div>

親要素に幅を設定することでこの問題が解決されることは理解していますが、私の場合、要素は画面サイズに応じて幅のサイズを変更するように設定されているため、それを行うことはできません。たとえば、ユーザーが電話を使用していて、縦向きから横向きになった場合、親要素はサイズ変更できる必要があり、そのために JavaScript を使用する必要はありません。

また、私の特定の状況では、親要素がフロートであることにも言及する必要があります。それが重要かどうかはわかりません。

4

4 に答える 4

1

質問に関するSheikh Heeraのコメントによると、これを達成する唯一の方法は、実際に親要素に幅を設定することです。私の状況では、最も堅牢な解決策は、メディア クエリを使用して画面サイズごとに幅を設定することでした。それはまさに私が望む解決策ではありませんが、最良の代替手段です。

于 2013-04-29T04:06:21.730 に答える
1

max-width CSS プロパティを使用しないのはなぜですか? Div、具体的にはここの子はブロック レベルの要素であり、親 div の幅に制限する必要があります。以下のコードが役に立たない場合は、作業内容を拡張する必要があります。

.child {
max-width: 100%
}

スタイルシートでそれを試してみてください。CSS マジックをご覧ください! 乾杯

于 2013-04-29T02:24:54.033 に答える
0

オーバーフロー スタイルを使用して、親内に子のサイズを含めることができます。

.parent {
    overflow: hidden;
}

.child {
    width: 100%;
}
于 2013-04-29T02:24:35.393 に答える