5

誰かに私の脳の蜘蛛の巣を一掃してもらいたいと思っています。ここで説明しようとしました（システムではGIFを投稿できないため、ASCIIアートを使用しました）

|--------------------------------------------------------------------|
| Browser Window                                                     |
|                                                                    |
| |--------------------------------------------------|               |
| |  Parent DIV                                      |               |
| |                                                  |               |
| |  |-----------------------------------------|     |               |
| |  | Child DIV #1                            |     |               |
| |  |                                         |     |               |
| |  |                                         |     |               |
| |  |                                         |     |               |
| |  |                                         |     |               |
| |  |                                         |     |               |
| |  |                                         |     |               |
| |  |-----------------------------------------|     |               |
| |                                                  |               |
| |                                                  |               |
| |  |-----------------------------------------|     |               |
| |  | Child DIV #1                            |     |               |
| |  |                                         |     |               |
| |  |                                         |     |               |
| |  |                                         |     |               |
| |  |                                         |     |               |
| |  |                                         |     |               |
| |  |                                         |     |               |
| |  |-----------------------------------------|     |               |
| |                                                  |               |
| |                                                  |               |
| |--------------------------------------------------|               |
|                                                                    |
|                                                                    |
|                                                                    |
|                                                                    |
|--------------------------------------------------------------------|

2つの子DIVを含む親DIVが欲しいのですが。子div＃1には長い段落があります。子DIV＃2には、テーブルに表示される可変幅のコンテンツが含まれています。

親DIVを子DIV＃2の幅まで拡張し、子DIV＃1を親DIVの幅まで拡張し、それ以上親を拡張しないようにします。

3つのDIVすべてをfloat：leftに設定しています。

子DIV＃2のみを含めると、親DIVはテーブルの幅（およびパディングなど）に拡張されます-まさに私が望むものです。DIV＃1を含めるとすぐに、子DIV＃1も同じ幅であるため、親DIVはブラウザウィンドウの幅に拡大します。

親DIVの幅を制限することはできますが、子DIV＃2の幅が可変であるため、これは行いたくありません。子DIV＃1の幅を制限することはできますが、子DIV＃2と同じ幅にしたいので、これは行いたくありません。DIV＃2の幅は可変です。

各ボックスのコンテンツの量は可変であるため、高さを制限したくありません。

これらの結果を得るための別のアプローチはありますか？

ありがとう、

ラルフ

4

2 に答える 2

0

興味深い質問です。私はjsソリューションに降伏する前に多くのことを試みましたが、これらの結果を得ることができる唯一の方法は、Hope I Helpedが彼の回答で提案したことを行うことでした.

私はここに実用的なサンプルを持ってきました:

基本的に、jQuery を使用すると、次のようなコードを作成できます。

$(document).ready(function() {
    $('#div1').css('width', $('#div2').css('width'));
});
于 2012-08-09T18:52:08.307 に答える
0

私があなたを理解しているかどうかは完全にはわかりませんが、両方の内側の div から float:left を削除してみます。親の幅を auto に設定し、子の幅を 1 から 100% に設定します。これにより、親はそれ自体をより大きな div (子 2) にサイズ変更し、子 1 をそのコンテナーのサイズに拡張できるようになります。これが役立つことを願っています。また、js フィドルを投稿して、あなたが何を持っているかを確認できる場合は、より良い手助けができるかもしれません。

于 2012-08-09T18:07:32.693 に答える