css - 删除 3D 按下​​效果 Internet Explorer 按钮

Question

我正在尝试删除 Internet Explorer 中按钮的3D 点击效果(我使用的是 IE10)。

我试过:

button:active {
  position: relative; 
  left: -1px; 
  top: -1px; 
}

但这会使整个按钮向左上角移动 1 px(不是我正在寻找的行为)。
我只想让文本保持在相同的位置，即使在单击时也是如此。

我找到了 this question没有好的答案，所以我在这里问。

到目前为止，这是我的代码:
http://codepen.io/anon/pen/aliFb

Answer 1

现在有同样的问题......有点晚了，所以我不知道答案是否仍然适用。

我的解决方案是将按钮的文本放在 span 元素中，然后将 style 设置为 transform: translateY(1px);。不再有不必​​要的压力效应。在尝试之前我有点担心，因为它会与 Windows 的 FF、Chrome 和 Safari 混淆。但奇怪的是，他们似乎忽略了它(至少现在是这样)。分别在28、27、5.1上测试。另外，我使用的是 IE 10。

祝你好运