CSS左右布局浮动高度问题

当使用CSS左右布局时，可能会遇到浮动元素高度问题。这是因为浮动元素脱离了正常的文档流，导致其高度无法正确计算。

解决这个问题的方法之一是使用清除浮动。具体步骤如下：

1. 在父元素上添加一个空格或换行符，以便让子元素在浮动元素后面重新排列。

2. 在子元素上添加一个clear属性，将其值设置为“both”或“left”。

例如，假设我们有一个包含两个子元素的父元素，并将左侧子元素向左浮动，右侧子元素向右浮动：

.parent {
  width: 300px;
  border: 1px solid black;
}

.left {
  float: left;
}

.right {
  float: right;
}

/* 清除浮动 */
.parent:after {
  content: "";
  display: block;
  clear: both;
}

在这个例子中，我们在父元素末尾添加了一个空格，以便让子元素重新排列。然后，我们在左侧子元素上添加了一个clear属性，将其值设置为“left”，以清除左侧子元素的浮动影响。这样就可以确保右侧子元素的高度正确计算了。