有寫過 CSS 的應該都知道有一個屬性為 float，例如我們常常使用 float 去做一些導覽列的應用:
例:
當然也可以使用 display: inline-block，達到類似的效果。
不過在以上這個例子，如果你仔細看了一下 HTML 與 CSS的程式碼，你應該可以發現
原本應該是 div > ul > li 的結構，而且 div 應該要有 #CCC地的背景顏色，但卻似乎沒出現。
若你再仔細一點按下 F12檢查元素，會發現 div 的高度竟然是 0 ?
這其實也就是元素並不會計算到有 float 屬性的元素高度，因此可能導致高度的值有誤
在目前新的瀏覽器中，我們可以在底下增加元素並賦予 clear: both 這個屬性來解決這個問題。(稱為 clearfix)
或是在 div 增加 overflow: auto; 的屬性:
我個人覺得更好的解法是利用 css 的擬元素