css 真是搞人啊 请问这里的文本为何能知道那个已经不在正常流里的元素？

2019 年 8 月 13 日
 Newyorkcity
https://codepen.io/AdmaEmail/pen/XWrXRrx

我认为 div2 应该直接被 div1 遮住。。
我认为这样是符合逻辑的：
div1 因为 float:left 所以从正常流中消失，浮在了原本位置，于是 div2 在正常文本流中放在了原本 div1 的位置
div1 和 div2 两个文本都很自然得放在块的左上角所以 div2 就被盖住了。。

然而结果是 div2 不知为何知道了那个地方有 div1 在，纠正了文本的位置。。请问这一机制是怎样的？谢谢
1507 次点击
所在节点    问与答
2 条回复
orcusfox
2019 年 8 月 13 日
要加一个 position，具体原因可以 stackoverflow
meepo3927
2019 年 8 月 14 日
float 机制还蛮复杂的，你的这种情况可以简单理解为：文字环绕机制。

div2 虽然被 div1 挡住了，但是 div1 和 div2 内部内容的排布还是有关联的。

如果想完全被遮住：给 div1 加 position: absolute，去掉 float:left

如果想清除浮动：给 div2 加 clear: both

这是一个专为移动设备优化的页面（即为了让你能够在 Google 搜索结果里秒开这个页面），如果你希望参与 V2EX 社区的讨论，你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://v2ex.ih06.com/t/591623

V2EX 是创意工作者们的社区，是一个分享自己正在做的有趣事物、交流想法，可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX