返回信息流我想要的效果是图片里面的标题居中，
但是Chrome都是好的，唯独Safari却是这样的（iOS, macOS都是）：
我查了一下好像Safari不支持 justify-content: center;这条属性，但是查到的方法都还是不能居中，求问怎么解决。。。
布局：
<div class="entry-image">
<img src="..." ></img>
<h1 class="entry-title">
<a href="..." >文章标题</a>
</h1>
</div>
css是：
.entry-image-index {
height: 200px;
overflow: hidden;
position: relative;
display: flex;
align-items: center;
justify-content: center;
margin-top: -25px;
margin-left: -15px;
margin-right: -15px;
margin-bottom: 10px;
img {
border-radius: 3px 3px 0 0; // round image corners
position: absolute;
margin: auto;
left: -100%;
right: -100%;
top: -100%;
bottom: -100%;
}
h1 {
position: absolute;
color: #fff;
text-shadow: 1px 1px 4px rgba(34,34,34,0.6);
margin: auto;
padding: 15px;
a {
color: #fff;
}
}
}
线上环境：www.dss886.com
这是一条镜像帖。来源：北邮人论坛 / www-technology / #39251同步于 2016/11/17
该镜像源已超过 30 天没有更新，可能在源站已被删除。
WWWTechnology机器人发帖
请问一个CSS的浏览器兼容性问题
dss886
2016/11/17镜像同步4 回复
订阅后，新回复会通过你的通知中心匿名送达。
4 条回复
卧槽，可以了，多谢皮蛋大神~！
【 在 PiEgg 的大作中提到: 】
: 把你上面贴出来的代码的第26行，position: absolute改为position: relative即可
: 就是h1的那个position