如何防止父div擴展父沒有指定父寬度？

Question

我希望有人能夠清理掉我的大腦中的蜘蛛網。我曾經想在這裏說明（系統不會讓我張貼GIF，所以我用ASCII藝術形式去）

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

我想有一個包含2倍孩子的DIV父DIV。子div＃1有一個長段。子DIV＃2包含顯示在表格中的可變寬度內容。

我希望父DIV擴展到Child DIV＃2的寬度，並且我希望Child DIV＃1只擴展到父DIV的寬度，並且不會再擴展父級。

我將所有3個DIV設置爲float：left。

如果我只包含子DIV＃2，父DIV擴展到表的寬度（加上填充等） - 正是我想要的。只要我包含DIV＃1，父DIV就會擴展到瀏覽器窗口的寬度，因爲子DIV＃1也是那麼寬。

我可以約束父DIV的寬度，但是我不想這樣做，因爲子DIV＃2的寬度是可變的。我可以限制子DIV＃1的寬度，但我不想這樣做，因爲我希望它的寬度與子DIV＃2和DIV＃2的寬度可變寬度相同。

我不想限制任何高度，因爲每個框中的內容量是可變的。

是否有另一種方法來獲得這些結果？

感謝，

拉爾夫

Answer 1

我不是完全肯定我理解你，但我會嘗試刪除浮動：來自內部的div離開。我將父級的寬度設置爲自動，並將子級1的寬度設置爲100％。這應該允許父級將自己調整到較大的div（子級2），然後讓子級1擴展到其容器的大小。我希望這有幫助。此外，如果你可以發佈一個js小提琴讓我看看你有什麼我可以幫助更好。

Answer 2

有趣的問題。在向js解決方案投降之前，我嘗試了很多，但我能得到這些結果的唯一方法就是做我希望我在幫助中提出的建議。

我有working sample來到這裏：

基本上，使用jQuery，你可以編寫類似的東西：

$(document).ready(function() { 
    $('#div1').css('width', $('#div2').css('width')); 
});