浮動DIV和靈活的高度

梅比這已經回答過了，卻找不到一個真正有用的答案，所以這裏有雲：浮動DIV和靈活的高度

我有這樣的佈局layout test，我需要橙色框具有相同的高度作爲綠色，這將有動態的內容。

我試過不同的解決方案，但沒有得到正確的結果。一個解決辦法是讓橙色和綠色的盒子有：

padding-bottom: 500em; 
margin: -500em;

和家長overflow: hidden;

但問題開始與紅色的盒底（浮在紫色的頂部）被切斷，因爲overflow: hidden;

有沒有人有解決方案或可能是一個想法？如果可能的話，我更喜歡純粹的CSS。

這對我的作品的解決方案：

2013-04-15 Graahf

jQuery或JS會幫助你檢測div的高度，然後設置另一個高度 –

橙色和綠色，這些會有動態的高度，或者它們可以是靜態的嗎？另外，如果您使用asp或php動態生成頁面，則可以插入一個來自這些頁面的數字。 –

是的，先謝了。只有綠色將具有動態高度，所以橙色底部應始終跟隨綠色底部。 – Graahf

更新了我自己的解決方案，有問題的鏈接。

2013-04-22 05:08:01 Graahf

對不起，我找不到純CSS的解決方案，但這個簡單的jQuery，你可能想要的結果：

jQuery(document).ready(function($){ 
var green = $('.col3').height(); 
var red = $('.col1').height(); 
    $('.col2').height(green - red + 15); 
});

2013-04-15 17:26:20 user1576978

最後+15是因爲紅色和綠色之間的區別是15px – user1576978

好點，但在左邊和右邊的col上使用了顯示錶格，裏面有表格單元格。最後一個左上角的div，作爲左下角與右下角之間的高度差。作品和純粹的CSS :)我會稍後發佈一個例子，當我在我的電腦:) – Graahf

回答