为什么我的网站在 Safari 上向左移动？

Question

你可以在这里访问我的网站

当我添加此 CSS 样式时会发生这种情况：

.container {
  margin-inline: auto;
  width: min(90%, 70.5rem);
}

我添加这个容器的原因是当有人在一个非常大的屏幕上打开网站时限制我的内容扩展。 这适用于其他浏览器。 任何帮助将不胜感激，谢谢。

Answer 1

MDN Web 文档：margin-inline CSS 简写属性是定义元素的逻辑内联开始和结束边距的简写属性，根据元素的书写模式、方向性和文本方向映射到物理边距。

根据 MDN web 文档，Safari 不支持内联边距。

尝试使用margin: 0 auto

欲了解更多信息，您可以访问： https://developer.mozilla.org/en-US/docs/Web/CSS/margin-inline

Answer 2

margin-inline is not supported by Safari, IOS Safari or Edge see so it probably isn't safe to rely on it given the ubiquity of Safari and the increasing use of Edge.

见https://caniuse.com/?search=margin-inline

需要使用其他一些在大屏幕上居中的方式。 也许更传统的 left: 50% 和 transform: translateX(-50%) 会有所帮助？