CSS :after pseudo element doesn't work inside button in any IE version

Question

I can't get this code to work in any IE version. Am I doing something wrong or is IE just crap as usual?

HTML:

<button>A button</button>

CSS

button {
    position: relative;
}

button:after {
    content: "Can u see me?";
    position: absolute;
    right: -100px;
    top: 0;
}

Demo: http://jsfiddle.net/96ryusnp/

Answer 1

You need to add overflow: visible to button.

<button>A button</button>

button {
    position: relative;
    overflow: visible;
}

button:after {
    content: "Can u see me?";
    position: absolute;
    right: -100px;
    top: 0;
}

http://jsfiddle.net/96ryusnp/1/

IE must set it to hidden by default on buttons.