在Safari中使用CSS对齐div水平和垂直

Question

我正在尝试使用CSS以水平和垂直方式来显示div。 这种方法适用于Chrome，但不适用于Safari。

.in-middle { min-height: 100%; min-height: 100vh; display: flex; align-items: center; justify-content: center; flex-direction: column; }

代码工作： http ： //jsfiddle.net/gjrwndye/1/

有什么建议可以改善它，使其也可以在野生动物园中使用。

Answer 1

使用浏览器前缀。

jsfiddle： http : //jsfiddle.net/3gkh6gz3/

display: -webkit-flex;
-webkit-justify-content: center;
-webkit-align-items: center;

您可以使用I Should I Prefix检查是否需要使用前缀。

您可以使用Autoprefixer自动为CSS 加上前缀。