css两个div如何并排

在网页开发中，有时需要将两个 div 元素并排显示。这可以通过 CSS 的浮动属性 float 来实现。

首先，在 HTML 中创建两个 div 元素，定义宽度和高度：

 <div class="container">
    <div class="left"></div>
    <div class="right"></div>
  </div>

  <span class="comment">// CSS 中设置样式</span> .container{
    width: 100%;
    height: 200px;
  }
  .left{
    width: 50%;
    height: 200px;
  }
  .right{
    width: 50%;
    height: 200px;
  }

以上代码设置了容器 div 的宽度为 100%，高度为 200 像素，左右两个 div 元素的宽度为 50%，高度为 200 像素。接着，为左右两个 div 元素设置浮动属性：

 .left{
    float: left;
  }
  .right{
    float: right;
  }

这样就可以将左右两个 div 元素并排显示了。但是需要注意的是，如果其中一个 div 元素高度比较大，在排列时会影响另一个 div 元素的位置，所以需要对容器元素进行清除浮动操作：

 .container::after {
    content: "";
    clear: both;
    display: block;
  }

这样，左右两个 div 元素就可以稳定的并排显示，并且容器元素高度也不会受到影响。