css不设置宽度怎么让两个div平行

CSS在页面布局中扮演着十分重要的角色。我们常常会遇到这样的一种情况，就是需要将两个div并排显示，而且不设置宽度。这往往让人感到困惑，下面我们来探讨一下如何解决。

 <div class="container">
        <div class="left-div">
            <p>这是左边div里的内容</p>
        </div>
        <div class="right-div">
            <p>这是右边div里的内容</p>
        </div>
    </div> 

我们首先需要用容器将这两个div包裹起来，然后对包裹容器进行设置，如下：

 .container {
        display: flex;
    } 

以上代码采用了flex布局，在容器中设置display:flex即可让内部的元素变成弹性盒子，从而采用弹性布局。此时左右两边的div默认采用了弹性布局，且自动并排。

 .left-div, .right-div {
        flex: 1;
    } 

接着，我们需要对左右两边的div分别进行设置。首先，我们需要使左右两边的div都可以自适应容器的宽度，这就需要将左右两边的宽度设置为相等。我们可以将左右两边的div宽度都设置为1，从而使其平分父容器。这就需要我们使用${flex：1}这个属性，让子元素根据父容器比例进行宽度的分配，这样左右两个div宽度会自动计算。

通过以上方法，我们可以轻松实现不设置宽度的情况下，让两个div并排显示。这不仅提高了页面的美观度，也提高了页面的可读性，为用户带来更好的体验。