CSS上的簡單模板出現問題

Question

我正在學習如何使用CSS e HTML5製作簡單的模板，但是我遇到了一個問題：我想使用側邊欄和文章列表創建容器，但它不起作用。 請相信：http://informaticalab.com/template.html

那條黑線應該是一個包含兩個元素的簡單邊框。 感謝您的幫助和英語不好， 費德里科

Answer 1

它看起來就像你有一個多餘的</div>，這是一個問題:)它在下面的小提琴除去不好意思。

如果您使用浮動元素，您需要清除浮動元素以便容器「拉伸」到內容的底部。

一個簡單的方法是創建一個名爲新類「清除」或類似的東西如下：

.clear { 
    clear:both; 
} 

但缺點是，你推出一個新的DOM元素簡單地修改佈局。

另一種解決方案（怪異模式http://www.quirksmode.org/css/clearing.html提供）是告訴含元素來處理這些浮動元素：

#container { 
    ....old code... 
    overflow: auto; 
    width: 100%; 
} 

這有在某些情況下一些怪癖，所以它給你，你選擇使用。

在這裏看到的小提琴：http://jsfiddle.net/callseng/kZB5j/

這將使用清晰元法。