CODEWITHSUNDEEP
htmlcssinternet-explorer-11
Jeanluca Scaljeri
Jeanluca Scaljeri

Reputation: 29189

styling difference between IE11 and chrome

I've this simple button with a + or a - as content

<button></button>

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

In all browsers I have installed on my Mac (Chrome,safari and Firefox) this button is styled correct, but check it out in IE11 (or even FireFox on Windows 8.1 its not perfect) the styling is bad

DEMO

Can someone explain to me what is wrong in my css, or maybe (most likely) what is wrong with IE11. Is there a fix, or should I change the css and don't use position: absolute maybe?

Upvotes: 1

Views: 873

Answers (1)

Salman Arshad
Salman Arshad

Reputation: 272406

You forgot to add left and top properties on the absolutely positioned element. Add them and IE will behave as expected.

Updated Fiddle

Upvotes: 2

Related Questions