CSS Border不会包含浮动项目

Question

我正在尝试创建一个两列布局。左栏是导航菜单，右栏是内容。

问题是，包装所有内容的边框仅包装右列内容，而左列导航菜单可视地运行div边框。

JSfiddle：http://jsfiddle.net/ekeWz/

有可能解决这个问题吗？

Answer 1

嘿现在就像你这样给你的css中的 #wrapper overflow:hidden;

#wrapper {
overflow:hidden;}

Live demo

Answer 2

通过将overflow:hidden;提供给您的父div或#wrapper div

，您可以获得所需的结果

http://jsfiddle.net/ekeWz/6/

Answer 3

我认为这就是你想要的：

#wrapper {
    width: 600px;
    float: left;
    border: 1px solid black;}
#left_menu {
    float: left;
    border-right: 1px solid blue;}
    width: 25%;}

一旦你在left_menu中留下浮动来打破div的流程，你必须用相同的浮点调整父div的流量。