css元素两边都不允许有浮动

CSS 可以让我们轻松地对网页进行排版，但在使用它们时，我们需要注意一些细节。例如，如果元素的两侧都有浮动元素，可能会导致排版出现问题。

要解决这个问题，我们可以使用 CSS 中的 clear 属性。这个属性可以强制元素的拥有者在另一个元素的一侧停止浮动。

.clearfix::after {
  content: "";
  display: table;
  clear: both;
}

在上面的示例中，我们创建了一个名为 clearfix 的类，然后使用 ::after 伪元素来清除元素的浮动。这个伪元素在元素的内容之后插入，用于清除浮动。

使用 clearfix 类时，只需将其添加到那些可能存在浮动元素的元素上即可。在这些元素中，加入一个空的 <div> 元素，并将 clearfix 类应用到这个元素上。这个元素将占据父元素中的一整行，同时清除本元素内部的浮动。

总之，使用 CSS 清除浮动可以避免网页在布局时出现不必要的问题。在必要的情况下，我们可以使用 clearfix 类来清除浮动元素并保持网页排版的正常。