用于Safari和Apple的CSS

Question

我有一个网站正在为客户构建，需要一些帮助......除Safari和任何应用设备外，所有浏览器中的一切看起来都很棒。

如果您在Chrome或FF上查看下面的链接，您会看到右上角的社交图标看起来不错，但在Safari或Apple设备上查看时，它们彼此堆叠在一起。

想知道什么我可以做的就是这是跨浏览器兼容....

http://msg.d1g.it

Answer 1

我不明白为什么它不Safari上工作，但为什么不采用float:left到4 <a>并给予header_html已知宽度让它成为350px所以是这样的：

.social_btns { /* give all your <a> this class */ 
    float:left; 
} 
.header_html { 
    display:inline-block; 
    float:right; 
    line-height: 30px; 
    padding-right: 10%; 
    width:350px; /* add this line */ 
} 

在Safari 7.0.3测试与网页检查