Safari中的Flexbox问题

2014-08-29 90 views 1 likes

我正在用flexbox测试一些东西，但我遇到了一些问题。我搜索了论坛，但没有找到我正在寻找的答案，所以我在这里注册，希望找到答案。Safari中的Flexbox问题

现在我知道我应该提供一些后备，我将在未来，但目前我无法让flexbox在Safari中工作（桌面既不移动）。我尝试了-webkit-prefix，这是http://caniuse.com/#feat=flexbox建议的，但它不起作用。

我可能只是想念一些东西，但我似乎无法解决问题。

我做了笔，这在Chrome的工作，但在Safari没有做......

HTML

<div class="aligner"> 
    <h1>Flexbox Testing</h1> 
</div>

CSS

body, html { 
    height: 100%; 
    width: 100%; 
} 

.aligner { 
    height: 100%; 
    width: 100%; 
    display: -webkit-flex; 
    display: flex; 
    align-items: center; 
    justify-content: center; 
}

这是链接Codepen http://codepen.io/linkerd/pen/vHibq

我真的很感谢帮助！

在此先感谢。

燕姿

来源

2014-08-29 linkerd

回答

Safari浏览器仍然需要供应商前缀Flexbox的。

地址：

.aligner { 

    -webkit-align-items: center; 
    -webkit-justify-content: center; 
}

笔：

http://codepen.io/anon/pen/xbamKx

一种避免这种头痛真正有用的工具是autoprefixer。它适用于grunt，gulp，命令行等。

来源

2015-03-09 21:11:40 ratherblue

哦，所以我只是使用了一些错误的前缀，或者不够。谢谢！我最近开始使用autoprefixer，确实非常方便！谢谢你的提示。 – linkerd 2015-03-11 10:58:48

Safari中的Flexbox问题

回答

相关问题