Ricky Dam
Ricky Dam

Reputation: 1895

Why doesn't inline-grid work in Safari?

I am working on a WordPress gravity form and used inline-grid for the layout.
It works perfectly in Firefox and Chrome.

But when it comes to Safari, display: inline-grid does not work.
Although display: inline-block works.


Run the following code snippet in Safari to see what I am talking about.

.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>

Upvotes: 6

Views: 3348

Answers (1)

Kosh
Kosh

Reputation: 18393

Safari supports CSS Grid Layout

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

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

Probably you're using not a very fresh Safari.

BTW, on my desktop v. 10.1.1 your code works as expected.

Upvotes: 4

Related Questions