在简单的css3动画上CSS一致的跨浏览器

Question

我的css一致性存在问题： http://www.progettostand.com/ 在右上方检查社交图标，IE上的图标位置是正确的（奇迹！），在FF加载时关闭20px，在页面加载时关闭，然后在首次悬停在Chrome上后居中。 当然，这是在边缘左行为之后的约束。 我试图摆弄它，但只是设法在浏览器之间切换问题，并且从未设法让所有三个按预期工作。 请帮帮我钉一下。

非常感谢您的时间和精力。

Answer 1

只是一个快速修复，目前我只有Chrome测试，所以不能真正保证其他浏览器，但也许尝试添加这样的东西你的风格：

#top-social-bar a{
 text-align:left;
}

#top-social-bar a:before, 
#top-social-bar a:after { 
  text-align: center;
}

Answer 2

有时外部主题不可靠。

您必须在style.css：

的末尾添加此内容

#top-social-bar{ 
    display:table;
}
#top-social-bar li {
    display: table-cell;
    float: none;
}
#top-social-bar a:before, #top-social-bar a:after{
    width:auto
}