弹性布局

<div id="div">
            <div class="div1">1</div>
            <div class="div2">2</div>
            <div class="div3">3</div>
          
        </div>

父元素

#div{
                width: 400px;
                height: 400px;
                background-color: yellow;
                display: -webkit-flex; /* Safari */
                  display: flex; //关键步骤
                  justify-content: space-between;//关键步骤
                  width:100%;

flex-wrap:  wrap;

                
            }

子元素
            #div div{
                width:33.333%;
                height: 100px;
               
            }