【问题标题】:flex Css doesn't support in Safari , iPhone 5 and mobile Browser Webviewsflex Css 在 Safari、iPhone 5 和移动浏览器 Webviews 中不支持
【发布时间】:2016-06-02 11:26:26
【问题描述】:

这些是 HTML:

<div class="btn-toolbar text-center" role="toolbar">
      <a href="#" class="btn btn-success">Link 1</a>
      <a href="#" class="btn btn-success">Link 11</a>
      <a href="#" class="btn btn-success">Link 111</a>
      <a href="#" class="btn btn-success">Link 1111</a>
      <a href="#" class="btn btn-success">Link 11111</a>
      <a href="#" class="btn btn-success">Link 111111</a>
      <a href="#" class="btn btn-success">Link 11111</a>
      <a href="#" class="btn btn-success">Link 1111</a>
      <a href="#" class="btn btn-success">Link 111</a>
      <a href="#" class="btn btn-success">Link 111</a>
      <a href="#" class="btn btn-success">Link 11</a>
      <a href="#" class="btn btn-success">Link 111</a>
      <a href="#" class="btn btn-success">Link 1111111</a>
      <a href="#" class="btn btn-success">Link 111111111</a>
      <a href="#" class="btn btn-success">Link 111</a>
      <a href="#" class="btn btn-success">Link 11111</a>
      <a href="#" class="btn btn-success">Link 11</a>
      <a href="#" class="btn btn-success">Link 11111111111</a>
      <a href="#" class="btn btn-success">Link 11111</a>
      <a href="#" class="btn btn-success">Link 1</a>
    </div>

这些是 CSS:

.btn-toolbar{
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
}
.btn-toolbar .btn{
  -webkit-box-flex: 1;
  -moz-box-flex: 1;
  -webkit-flex: 1;
      -ms-flex: 1;
          flex: 1;
}

flex Css 不支持 Safari、iPhone 5、IOS 6 和移动浏览器 Webviews。我使用浏览器支持,但它仍然无法正常工作。请提供任何解决方案。我不想使用任何固定宽度。

【问题讨论】:

    标签: ios css webview safari flexbox


    【解决方案1】:
    .btn-toolbar{
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
      -webkit-flex-wrap: wrap;
          -ms-flex-wrap: wrap;
              flex-wrap: wrap;
    }
    .btn-toolbar .btn{
      -webkit-box-flex-grow: 1;
      -moz-box-flex-grow: 1;
      -webkit-flex-grow: 1;
          -ms-flex-grow: 1;
              flex-grow: 1;
    }
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2012-01-17
      • 2020-03-02
      • 1970-01-01
      • 2011-07-28
      • 1970-01-01
      • 1970-01-01
      • 2020-10-05
      • 1970-01-01
      相关资源
      最近更新 更多