刪除3D按下效果Internet Explorer按鈕

Question

我試圖刪除在Internet Explorer（我正在使用IE10）上的按鈕上的3D效果的。

我曾嘗試用：

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);。並沒有更多不必要的按壓效果。在嘗試之前我有點擔心，因爲它會混淆FF，Chrome和Safari for Windows。但奇怪的是，他們似乎忽略了它（至少現在是這樣）。分別測試28,27和5.1。另外，我使用的是IE 10

好運