如何在CSS中設置浮動div的高度？

我有兩個浮動div，每個都是50％寬，我遇到的問題是我無法讓它們伸展到窗口的整個高度。基本上我希望每個格有50％的寬度和100％的高度（但不工作）如何在CSS中設置浮動div的高度？

HTML

<section> 
    <div></div> 
</section> 
<section> 
    <div></div> 
</section>

CSS

section { 
    background: black; 
    width: 50%; min-height: 100%; height: 100%; 
    margin: 0; 
    float: left; 
} 
section > div { 
    height: 100%; 
}

來源

2010-06-15 xj9

如果你告訴我們的源代碼（HTML/CSS）它會幫助你已經有。 – 2010-06-15 21:27:06

由於您沒有提供任何代碼，我是一個相當幸運的人，我只會猜測。你在第21行的第6行有一個錯字。祝你有美好的一天。 – 2010-06-15 21:30:30

@Marcel Korpel和Josh oops ..固定 – xj9 2010-06-15 21:38:01

假設當你談論100％高度，你指的是視圖端口的100％，爲了像div這樣的元素使用100％的高度，你需要將它的容器元素設置爲100％......最有可能的是，你的身體/ html標籤沒有設置爲100％，這就是爲什麼你要爲你的兩個浮動div設置100％高度的原因他們上班！

例：

html, body { width:100%; height:100%; } 
div#one { float:left; width:50%; height:100%; } 
div#two { float:right; width:50%; height:100%; }

這是一個簡單的CSS代碼，還有其他的方式來這少得多的代碼...

希望它能幫助！

來源

2010-06-15 21:36:31 Zuul

這樣做有一個缺點：在基於WebKit的瀏覽器中，50％的不均勻度將向下舍入，導致窗口寬度不均勻時兩個div之間會出現1px的間隙（只需調整Chrome或Safari的窗口大小几次）。 – 2010-06-15 21:53:18

@Marcel Korpel，它和奇怪的風景，但我只是學習新的東西;）Tks！ – Zuul 2010-06-15 22:40:29

不客氣。哦，我的意思是「寬度」，而不是「與」。：X – 2010-06-15 23:37:54

我想這可能會幫助你..

http://www.alistapart.com/articles/fauxcolumns/

它表明你怎麼能得到對齊列:)

來源

2010-06-15 21:38:32 Prozaker

如何在CSS中設置浮動div的高度？

回答

相關問題