美文网首页
flex的IE兼容性问题

flex的IE兼容性问题

作者: 小松鼠hust | 来源:发表于2018-03-02 09:23 被阅读884次

    flex的IE兼容性

    在 IE11 上 align-items 对于父元素设置 min-hight 高度不能实现垂直居中。设置为 height: 20px 就可以了。
    示例:

    <!DOCTYPE html>
    <html>
    <head>
      <meta charset="utf-8">
      <style>
     .ct{
          display: flex;
          align-items: center;
          justify-content: center;
         min-height: 3em;
         background: #f00;
    }
    .item{
      background: #ccc;
    }
      </style>
      <title>flex的IE兼容性问题</title>
    </head>
    <body>
      <div class="ct">
        <div class="item">1</div>
        <div class="item">2</div>
        <div class="item">3</div>
      </div>
    </body>
    </html>
    

    相关文章

      网友评论

          本文标题:flex的IE兼容性问题

          本文链接:https://www.haomeiwen.com/subject/ajvoxftx.html