提问者:小点点

flex-wrap在internet explorer中不起作用


我有4个盒子,它是一个标准的2列2行盒子。不幸的是我必须提供ie支持。在internet explorer中,flex wrap不起作用,所以所有的框都在一排,看起来很乱。有没有一种可以替代柔性包装的方法呢?代码非常基本,在所有浏览器中都能工作,但在IE中不行。

    display: flex;
    flex-wrap: wrap;
    justify-content: center;

共1个答案

匿名用户

null

main { background: #E15555; } 
.wrap { 
   display: -webkit-box; 
   display: -ms-flexbox; 
   display: flex; 
   -webkit-box-align: center; 
      -ms-flex-align: center; 
         align-items: center; 
   -webkit-box-pack: center; 
      -ms-flex-pack: center; 
    justify-content: center; 
   max-width: 700px; 
   margin: 0 auto; 
   min-height: 100vh;
} 
.box { padding: 20px; } 
.content { 
    width:  100px; 
    height: 100px; 
    background: #FEC8EE;
}
<body>
<main> 
    <div class="wrap"> 
        <div class="box"> 
            <div class="content"></div> 
        </div> 
        <div class="box"> 
            <h1>Hola Amigo</h1> 
        </div> 
     </div>
</main>
</body>