Flexbox 的 align-items 和 justify-content 属性在 Safari MacOs 上无法正常工作。

Question

我在CSS中有一个用于某个部分的代码

align-items: end;
justify-content: end;

在Chrome MacOS上运行良好，但在Safari上，元素未从底部对齐。有人知道是什么原因吗？

链接：https://q6demo.squarespace.com/homepage#our-6-step-process-section 图片链接：第一张 ，第二张

- Marian07

Answer 1

我用过这个东西，它有效。

-webkit-justify-content: flex-end;
align-items: flex-end;
-webkit-align-items: flex-end;

来源：为什么我的iPhone上"display: flex"和"align-items: center"不再起作用了？

- Marian07

---

哇，这对我来说完美地运作了。谢谢你。 - mross1080

太好了！我很高兴它对你有用！ - Marian07

解决方案很简单，只需使用“flex-end”而不是“end”。前缀不必要。 - Octo Poulos

Answer 2

我的朋友，我认为这是因为浏览器支持的原因。

请参考以下链接了解浏览器的元数据支持情况： https://istack.dev59.com/hJPvE.webp 关于此主题的详细信息，请访问以下网址： https://www.w3schools.com/css/css3_flexbox.asp

- عبدالله مصطفي

---

我已经尝试使用前缀值，但效果相同。 最新版本的Safari默认支持Flexbox。 - Marian07