在Microsoft Internet Explorer 11+中,您可以解决这个问题!对于按钮的内部元素,请使用position: relative
。
html:
<button><span>Submit</span></button>
CSS:
button > span{position:relative}
享受!
display: inline-table
时无法正常工作。 - Paya更新:适用于IE11+,可以去掉。
在旧版本的Internet Explorer中,你无法摆脱这个问题。
正如@Spudley所说:
如果你不想使用
如果真的很重要,那么元素是唯一替代方案,但为了修复这个问题而仅仅进行切换并不值得。Internet Explorer的用户已经习惯了这种效果。
<button><span>Submit</span></button>
button:active > span {
-ms-transform: translate(0px, -0.5px);
}
translate(-0.5px -0.5px)
,它完全抵消了按钮在被按下时的“移动”。此外,通过使用-ms-transform
属性,它不会对任何其他浏览器产生影响。对我来说,这是最好的解决方案。如果它是一个按钮,就没有必要不使用按钮标签。 - Dylanbob211
button
元素。 - Spudley