`
kabike
  • 浏览: 598065 次
  • 性别: Icon_minigender_1
  • 来自: 大连
社区版块
存档分类
最新评论

浮动(float)与文档流(normal flow)

    博客分类:
  • html
阅读更多
根据规范来看,float的元素应该脱离文档流才对.
原文说
In the float model, a box is first laid out according to the normal flow, then
taken out of the flow and shifted to the left or right as far as possible.

看下面的代码
.div2 {
	width: 200px;
	height: 100px;
	float: left;
	border-style: solid;
}

.div3 {
	width: 400px;
	height: 50px;
	background-color: silver;
}

.main {
	width: 650px;
	border: 1px solid;
}

以及
<body>
	<div class="main">
		<div class="div2">div2</div>
		<div class="div3">div3</div>
	</div>
</body>

FF下很明显可以看出div2已经不在文档流里了,因为div3的布局无视了div2的存在.(尽管div3里的内容是贴着div2的)

IE7则不然,div2依然大摇大摆的在文档流里占据着位置
分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics