div的大小動態到文本 - 清除兩個都不起作用

Question

我希望文章的div（白色內容和右側灰色列）隨白色文本的高度擴大。

我嘗試添加clear:both到#bodycont，但它並不能幫助

我怎樣才能使它靈活？

Answer 1

解決方法是加入display:table並刪除高度。由於允許我根據文本顯示高度。

很簡單！

Answer 2

clear: both;要在使用浮動後添加：將它放在#bodycont將是有用的，如果您的頭部浮動（我沒有檢查）。將其放置在父不會做任何事情（雖然還有一些其他方法，其中，選擇與這個父，即parent:after { /* strange bunch of instructions working in IE8 and above */ }開始，但是這不是家長本身）

的一般性說明：

• 不在列或佈局塊上使用height屬性。
  你不知道有多少內容會在那裏，在另一個類似的頁面或在一年內。
  你不知道有些遊客是zooming text很多或智能手機（related）。
  你可以有一個沒有一次性使用height屬性的佈局：當圖形元素完全顯示時（當有一個不應該被裁剪的已知高度的好背景）時，特殊情況需要min-height，一般情況下使用的方法不需要元素的高度來正確顯示。
• 將clear: both添加到浮動列之後的元素上或包含浮動元素的元素的同級中。在你的情況下，頁腳。
• 浮動元素意味着其內容將從（HTML）流中移除。它不再爲確定父母的身高而「算」，它不是真的存在。因此，只包含浮動元素的元素的高度爲... 0.所有東西都從流動中移除，沒有高度。這很煩人，如果你對這個父母有一個背景，因爲它不會再顯示......但你仍然希望這個背景具有與最高的漂浮兒童一樣的高度。 Thierry Koblentz在這裏描述了一個（不是這樣的）現代化的修補程序：http://www.yuiblog.com/blog/2010/09/27/clearfix-reloaded-overflowhidden-demystified/（:before部分僅存在一致的摺疊頁邊距，您只需要:after以及父，下一個元素之間的錯誤，這就是:after是）