Question

我正在开发此网站，并且顶部的第一个滑块根本没有在Safari上显示。我只有iPad，所以我无法检查它是隐藏的还是有0高度，但我之前遇到过flex和Safari的问题，我相信flex元素的高度为0。我现在已经将元素（.fs-default .slides）更改为显示：block，并尝试清除iPad上的缓存，但它仍未显示。这可能是一个缓存问题。

我觉得显示器有一个普遍的问题：在Safari上有0高度的flex元素，但我没有发现其他人有同样的问题。

以下是我添加到slide元素的样式：

.fs-default .slides {
  height: 500px;
  display: block;
  min-height: 60vmin;
  align-items: center;
}

滑块和幻灯片的结构如下所示，其中每个li都是幻灯片。

<div class="fs-default">
  <div>
    <ul class="slides">
      <li>
        <img>
      </li>
      <li>
        <img>
      </li>
      <li>
        <img>
      </li>
    </ul>
  </div>
</div>

由于我无法确定问题所在，很难知道该问题包含哪些内容，所以我也会链接到该网站，以防问题出在其他地方。 http://dev.physelec.com.au/

http://codepen.io/anon/pen/qrRVew这是我试图表明问题的一支笔。奇怪的是，它与网站不是同一个问题。

Answer 1

如果您在flex和display: flex上撤消header和.main-content-area，则可以在Safari中使用该布局。我不认为这些属性是必要的，我认为这是你使用flex速记，你为flex-basis（第3个值）指定0。http://codepen.io/anon/pen/evWVaY

Flex /块元素未在Safari上显示

1 个答案: