ios - Safari 和 Apple 的 CSS

Question

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

如果您在 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 */
}

使用 web inspector 在 safari 7.0.3 上测试