html5元素重叠,HTML5中div元素的重叠

我在下面的代码中制作了3格。第一个有导航元素，第二个有段元素。HTML5中div元素的重叠

如果你运行上面的代码，你会看到nav 的边界和两个部分。我的疑问是第1节左边的 元素应该在导航栏边界的右侧。但由于 不存在(通过运行代码可以看出)，这意味着div“a” 和“b”重叠。我是否以正确的方式思考？如果我是 的权利，为什么CSS被设计成这种重叠div的方式。

事实上，这与在CSS中引入div的原因相矛盾。

nav {

float: left;

width: 200px;

border: 1px solid black;

}

section {

border: 3px solid red;

}

nav

• Home
• CSS
• HTML
• JavaScript

section

Notice we have put a clearfix on the div container. It is not needed in this example, but it would be if the nav element was longer than the non-floated section content.

section

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus imperdiet, nulla et dictum interdum, nisi lorem egestas odio, vitae scelerisque enim ligula venenatis dolor. Maecenas nisl est, ultrices nec congue eget, auctor vitae massa. Fusce

luctus vestibulum augue ut aliquet.

+0

你有使用浏览器的检查元素工具来实际看看有什么重叠吗？ –

+0

请参阅：http://stackoverflow.com/questions/2062258/floating-stuff-within-a-div-floats-outside-of-div-why –