2011-08-15 18 views
0

這是做了很多的研究,而不:-(適當成功後計算器我的第一個問題。多列的佈局與高度相等(視口最小100%)和圓角

我爲了完成三列布局而做的各種內容不同,因此每列內容的高度不同,但列的高度應該是相同的,這樣他們的背景顏色就可以達到底部了。發現實施例這樣

How to make rounded corners on equal height columns

當然這一個

http://matthewjamestaylor.com/blog/equal-height-columns-cross-browser-css-no-hacks

但他們不這樣做的伎倆,因爲它們使用溢出:隱藏,做一個假的高度比頁面將永遠是很長很多。所以當然,每一列的背景顏色都會下降到最低點。這很好,但還不夠,因爲我不得不用圓角來塑造內容元素的背景。它應該看起來像在圖像上以下地址:

http://www.addorange.de/uploads/3columns_rounded_corners.jpg(對不起,我不能發表圖片尚未:-()

你也許有人遇到類似的挑戰,通過純CSS來解決這個問題。

謝謝

基督教

回答

0

兩個解決方案:

  • 您可以使用display: table-cell您的三列
  • 調整它們的大小與JavaScript
+1

這個CSS屬性不爲小於IE8瀏覽器上運行 –