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也許是position: absolute ？

Answer 1

您忘記在絕對定位的元素上添加left和top屬性。 添加它們，IE將按預期運行。

更新小提琴