如何用CSS使两个浮动div高度相同？

使用CSS的等高浮动div

您想要实现两个共享相同高度并有一条线分隔它们的浮动div。表格提供了一种方便的解决方案，但出于语义原因，您需要寻求 CSS 替代方案。

等高列的关键在于采用广泛的底部填充和负底部边距。此外，列必须包含在隐藏溢出的 div 中。

对于垂直文本对齐，请考虑以下 CSS 片段：

#container {
  overflow: hidden;
  width: 100%;
}
#left-col {
  float: left;
  width: 50%;
  background-color: orange;
  padding-bottom: 500em;
  margin-bottom: -500em;
}
#right-col {
  float: left;
  width: 50%;
  margin-right: -1px;
  border-left: 1px solid black;
  background-color: red;
  padding-bottom: 500em;
  margin-bottom: -500em;
}

使用此 CSS，您可以轻松对齐高度浮动 div 并创建视觉上吸引人的布局。

以上是如何用CSS使两个浮动div高度相同？的详细内容。更多信息请关注PHP中文网其他相关文章！