如何阻止Internet Explorer在按下时向按钮添加填充？

Question

我使用CSS设计了提交按钮。在任何Webkit或Gecko浏览器中，它都可以很好地工作，但是当按下按钮时，Internet Explorer 9会在按钮的文本中添加填充。另外，你可以看到这个愚蠢的虚线边框。它看起来像这样：

http://img6.imagebanana.com/img/tkp7l8m3/button.png

我在CSS中为输入指定的特殊背景图像：活动仅在IE中显示，如果在按钮的边框和此虚线边框之间的非常薄的区域中单击按钮。如果在中间点击按钮，它会保留悬停背景，尽管它被按下了。

任何人都可以帮我删除这个额外的填充和虚线边框吗？

提前致谢

Qoguth

Answer 1

要摆脱虚线边框，您可以使用纯CSS：

button { outline: none; }

对于点击时的填充，我担心它是内部浏览器行为的一部分，无法更改。

Answer 2

你可以尝试：

/* Swap 1px 6px for your desired top+bottom and left+right padding. */
button { padding: 1px 6px; }
button:active { outline: none; padding: 1px 6px; }

假设您实际上想要填充而不是其他属性。

Answer 3

到目前为止给出的两个答案都是不正确的。你应该只隐藏键盘焦点轮廓：活动，隐藏它：焦点太伤害键盘导航。

button:active { outline: none; }

如前所述，左上角填充的增加不会过度。