为什么内联网格在 Safari 中不起作用？

Question

我正在开发 WordPress 重力表单，并使用内联网格进行布局。
它在 Firefox 和 Chrome.

中完美运行

但是对于Safari，display: inline-grid就不行了。
尽管 display: inline-block 有效。

运行 Safari 中的以下代码片段，看看我在说什么。

.item {
  width: 50px;
  height: 50px;
  background-color: lightgray;
  display: inline-block;
  margin: 5px;
}

.item2 {
  width: 50px;
  height: 50px;
  background-color: gray;
  display: inline-grid;
  margin: 5px;
}

<div class="item"></div>
<div class="item"></div>
<hr>
<div class="item2"></div>
<div class="item2"></div>

Answer 1

Safari 支持CSS 网格布局

desktop -- from version 10.1
ios -- from version 10.3

http://caniuse.com/#feat=css-grid

可能您使用的 Safari 不是很新鲜。

顺便说一句，在我的桌面 v.10.1.1 上，您的代码按预期工作。

为什么内联网格在 Safari 中不起作用？

Why doesn't inline-grid work in Safari?

html

css

browser

safari

inline