html - IE11 和 chrome 之间的样式差异

Question

我有一个简单的按钮，内容是 + 或 -

<button></button>

button::before {
    content: '-';
}
button.active::before {
    content: '+';
}

在我安装在我的 Mac 上的所有浏览器中(Chrome、safari 和 Firefox)这个按钮的样式都是正确的，但是在 IE11 中检查一下(甚至 Windows 8.1 上的 FireFox 也不完美)样式很糟糕

DEMO

有人可以向我解释我的 css 有什么问题，或者(很可能)IE11 有什么问题。是否有修复，或者我应该更改 css 并且不使用 position: absolute 也许？

Answer 1

您忘记在绝对定位元素上添加 left 和 top 属性。添加它们，IE 将按预期运行。

Updated Fiddle