强制包围div以包围元素

Question

我有一个容器div应该改变以包围它的内容产生一个有边界的效果但是由于某种原因div似乎只是在页面顶部显示为一行。下图显示了我想要实现的内容，但正如您从 Fiddle 中看到的那样，它无法正常工作。

有什么建议吗？

Code enclosed in Fiddle.

Answer 1

这是因为div的内容向左浮动而div不是。将float: left;应用于带边框的div，它可以正常运行：http://jsfiddle.net/9yUX3/7/

Answer 2

解决此问题的另一种方法是将overflow：hidden（或auto）应用于.boxed_content DIV。这对您来说可能更好，因为将浮动物应用于容器可能会使您的布局陷入困境。

.boxed_content {
   border: 1px solid black;
   box-shadow: 0px 0px 5px 5px #c4c4c4;
   overflow:hidden;
}

Answer 3

以下是包含浮点数http://www.visibilityinherit.com/code/contain-floats.php

的所有方法