5

手動の幅を指定せずに、2番目のdivを使用して親divの使用可能なスペースを占有することは可能ですか？

これが、試したデモのフィドルです。

.right_cnt {
    display: table-cell;
    background:#FFC;
}

注：利用可能な適切なスペースを占有するには、黄色のボックスが必要です。

4

4 に答える 4

7

display:table; width: 100%;親要素に設定しfloat: left、兄弟から削除します。 http://jsfiddle.net/byNpM/2/

于 2013-02-27T09:14:42.090 に答える
1

テーブルレイアウトを使用してこれを行うことは可能ですが、必ずしも最も簡単な方法ではありません。フィドルをフォークしてデモンストレーションします。

より簡単な方法は、2番目のセルを変更してすべてのテーブル表示プロパティを削除し、2番目の要素overflowをhidden：に設定することです。これを示す別のフォーク。zoom: 1この手法を古いIEで機能させることができます。あなたがの副作用に満足しているなら、これはあなたの目的のためにより簡単かもしれませんoverflow

于 2013-02-27T09:19:34.867 に答える
1

この投稿は、あなたが探しているものかもしれません。

特に、Xanthirの答えを見てください：

これに対する解決策は実際には非常に簡単ですが、まったく明白ではありません。特定の方法でフロートと相互作用する「ブロック フォーマット コンテキスト」と呼ばれるものをトリガーする必要があります。... ... ...

于 2013-02-27T09:24:58.460 に答える
0

display:table-cellno の行の最後の div ではwidth、囲んでいる親 div を埋めるために引き伸ばされますdisplay:tableが、テーブルセルにはオフにできない暗黙の「最小幅」動作があり、強制的にそれはその子の幅になります。

左セルを 100% 幅の右セルの幅の広いパディングの上に絶対配置する必要がありました。これにより、幅 100% の内側の div は、ウィンドウが狭くなってコンテンツがスクロールしたときに、必要に応じて縮小されます。

http://jsfiddle.net/kmbro/cqkzbc4a/

于 2016-11-08T22:02:41.097 に答える