如何在div中应用flex wrap属性?

时间:2018-05-23 10:01:32

标签: html css css3 flexbox

<html>
   <head>
      <link href="http://fonts.googleapis.com/icon?family=Material+Icons" 
            rel="stylesheet">
   </head>
   <body>
      <div class="row">
         <div class="col s12">
            <div class="col s6 content-box">
               <div class="subcontent" id="main" >
               </div>
               <!--sub content div for table-->
               <div class="subcontent">
                  <div id="chart1" class="charts">
                  </div>
               </div>
            </div>
            <div class="col s6 content-box">
            </div>
         </div>
      </div>
   </body>
</html>

我用css:

.charts {
    height: 162px;
    background-color: #f3eaeacc;
    width: 100%;
    display: -webkit-flex;
    -webkit-flex-wrap: wrap;
    display: flex;  
    flex-wrap: wrap;
    border-radius: 10px;
    margin-bottom: 5px;
}

这是div,我想在里面使用flex wrap属性。任何人都可以向我建议如何?

1 个答案:

答案 0 :(得分:0)

.subcontent .charts{
    display: -webkit-flex;
    -webkit-flex-wrap: wrap;
    display: flex;  
    flex-wrap: wrap;
}

希望这段代码可以提供帮助。