重疊的DIV（可變寬度問題）

我有2個div列設置爲val％，在那些列內我有一些較小的靜態寬度/高度框..重疊的DIV（可變寬度問題）

..另一方面可變寬度/高度欄。

但是，當我改變瀏覽器窗口的寬度時，這些div重疊。

我已經嘗試過overflow/float/min和maximum height等等的各種組合，但我沒有得到任何地方。

有人能指出我錯過了什麼嗎？

粗糙的jsfiddle： http://jsfiddle.net/2xdcases/

實際頁： https://www.ablueman.co.uk/testbench/newindex/

screenshot

.content { 
margin: 2px 0px 2px 0px; 
border-bottom: 1px solid #BABABA; 
padding: 10px 10px 10px 10px; 
background-color: #b0c4de; 
} 

.cont { 
float:left; 
width:48%; 
margin: 1px 0px 1px 0px; 
border-bottom: 1px solid #BABABA; 
padding: 5px 5px 5px 5px; 
/*background-color: #b0c4de;*/ 
/* min-height: 600px; */ 
} 

.co { 
float:left; 
width: 200px; 
Height: 300px; 
margin: 1px 0px 1px 0px; 
border: 1px solid #BABABA; 
padding: 2px 2px 2px 2px; 
overflow:auto; 
}

來源

2014-08-31 ablueman

的jsfiddle是在操作系統工作正常，在最新的Safari瀏覽器X – Gersom 2014-08-31 08:50:36

你嘗試不同的瀏覽器的寬度？它只有當左邊的盒子從3列彈出到2或伸出時......它們重疊。 – ablueman 2014-08-31 08:51:20

通過您的直接鏈接，我能夠重現錯誤。看到我的答案尋求解決辦法 – Gersom 2014-08-31 08:53:17

給#contentWrapper overflow: hidden;

因爲在左側的元件被浮置，則父元素將會OT改變它的大小相應

欲瞭解更多信息，請閱讀此：http://css-tricks.com/all-about-floats/（尤其是標題「的大崩潰」下）

來源

2014-08-31 08:51:47 Gersom

啊..我試過溢出：隱藏;在所有的類上，但實際上沒有該標識的CSS。很好，謝謝！ – ablueman 2014-08-31 09:01:00

會給那個讀ta。 – ablueman 2014-08-31 09:04:40

重疊的DIV（可變寬度問題）

回答

相關問題