使用div清除元素：

Question

在尋找this question的解決方案時，我試圖添加一個帶有:after僞類的清除元素。它沒有我想要的東西，而不是我期待的理由 - 縮小東西下來後，我發現，定義以下清除元素：

.right_field > div:after 
{ 
    content: "style=\"foo\""; 
} 

我希望它做的是文本style="foo"追加到在.right_field裏面的div元素的結尾，但是它沒有添加任何視覺元素，並且清除了元素，以便它們環繞着它們的浮動子元素。

請參閱下面的小提琴演示。嘗試從內容屬性中刪除foo，看看它不再清除該元素，而只是將文本追加到每個元素。 http://jsfiddle.net/dNJxd/5/

爲什麼會發生這種情況，這是一個可以依靠的功能嗎？我在Chrome，Firefox和IE7-9上測試過它們，它們都以相同的方式工作。

Answer 1

您的示例確實在div元素後附加了文字style="foo"。唯一不會這樣做的瀏覽器（來自您的測試瀏覽器列表）是IE7，因爲它不支持::after僞類。

也許你需要擴展你的JSFiddle result window更進一步。

此外，這並不清除浮動 - 它只是給父母div一些高度，因爲附加文本不浮動。當div的內容比附加文本的高度更高時，仍然會發生邊框塌陷。