时间戳

首页 > 解决方案 > 清晰属性 CSS[style="clear:both;" ]

html - 清晰属性 CSS[style="clear:both;" ]

问题描述

<div style="position:sticky">
tto
</div>
<div style="float:left; padding-bottom: 3000px">
blah
</div>

使用上面的代码粘贴位置不起作用。我尝试将所有这些都保存在容器中，以某种方式使“位置：粘性”起作用。

<div class="container">
<div class="sticky">
tto
</div>
<div style="float:left; padding-bottom: 3000px">
blah
</div>
</div>

.container{
  display: flex;
  flex-direction: column;
}

.sticky{
  position: sticky;
  top: 0;
}

后来令我惊讶的是，我看到有人用这段代码修复了所有问题。

<div style="position:sticky;top:0">
tto
</div>
<div style="float:left; padding-bottom: 3000px">
blah
</div>
<div style="clear:both;"></div> //extra div needed

有人可以解释一下不同容器中的“clear：both”属性如何使其工作以及这里发生了什么。提前致谢。

标签： htmlcss

解决方案

推荐阅读