css 比以前的代码更喜欢媒体查询

Question

所以我做了一些网格布局的工作，并想在此媒体查询中更改它:

@media(min-width: 700px){
#container{
    grid-template-rows: 320px;
    grid-template-columns: 320px 320px;
    justify-content: center;
    align-content: center;
}
#left{
    grid-row: 1 / 2;
    grid-column: 1 / 2;
}
#right{
    grid-row: 1 / 2;
    grid-column: 2 / 3;
}
}

如果我在普通浏览器中打开该页面，它可以正常工作，但如果我检查元素或在我的 Iphone 上显示它，它只显示媒体查询版本。

这是在线页面的链接: link to page

Answer 1

如果您访问 caniuse.com，它会提到一个已知错误

“Safari 尚不支持使用 grid-template-rows 等网格属性进行内部和外部大小调整”

可能是您的问题？