在IE按钮中删除额外的填充

Question

在我的网站上，有很多按钮。 在Chrome中查看时，按钮宽度恰好适合动态按钮文本，但在IE中，我可以看到左右两侧都产生了额外的填充...

是否有任何CSS规则可以让我带走这些填充？ 谢谢。

Answer 1

可能会有点晚，但是当我今天搜索SO以寻找同样的问题时，我发现了这个问题 。 显然，这不是真正的填充（在某种意义上它不能通过padding:0px来关闭padding:0px ），而是我们都非常喜欢IE的那些奇怪的奇怪之一。 （注意假填充如何与按钮文本长度O_o一起缩放）。 幸运的是，有一个简单的解决方案，它作为描述在这里 。

基本上你只添加overflow:visible; 按钮（我不需要额外的width:auto;如此处所述）。 不要问 - 这绝对不是你认为应该做的，但是......这是IE Land，规则在那里不同。 请注意，当您的按钮位于表格单元格内时，这显然不起作用。

我想CSS重置可能已经解决了这个问题，因为有人已将此包含在一些全局声明中。 只需添加此答案，就如何以及为何提供更多信息。

永远不要放弃，人们 - 我们的孩子将会看到一个没有IE怪癖的世界......人们可以希望。

Answer 2

您可以使用reset css，因为它可以避免浏览器不一致。

请参阅http://sixrevisions.com/css/css-tips/css-tip-1-resetting-your-styles-with-css-reset/

访问http://www.cssreset.com/scripts/html5-doctor-css-reset-stylesheet/获取reset.css

Answer 3

使用额外语句显示来管理以避免额外的间距：块; 在CSS中如此：

.menu button{
    display:block;
    width:100%;
    padding:0;
}

请注意，我没有使用width：auto，因为它不是我的选项 - 按钮为空，宽度取自父div。