css - IE11 making background image text blurry

Question

I'm working on a website, where I use image sprites on a button. In every other browser I've tried, except for IE11, the text on my sprite is crisp as it should be, but in IE11, the text gets blurry (See images).

The blurry one being IE11 ofc. The width of the sprite is 189px and the height is 378px. I use the following CSS:

button {
    width:189px;
    height:189px;
    background-image:url('../images/kontakt-os.png');
    background-position: top;
    cursor:pointer;
    border-radius: 100px;
}

button:hover {
    background-position: bottom;
    -webkit-box-shadow: 0px 10px 1px 1px rgba(179, 47, 1, 1.0);
    -moz-box-shadow: 0px 10px 1px 1px rgba(179, 47, 1, 1.0);
    box-shadow: 0px 0px 10px 1px rgba(179, 47, 1, 1.0);
}

So is this just an IE flaw, or can I actually do something about it ?

Thanks in advance.

EDIT: I might just add, that if I just insert the same image as <img src="lala.png"> the text is NOT blurry. It only applies to backgrounds :/

Answer 1

It is a normal IE bug.

http://www.infoworld.com/t/microsoft-windows/blurry-fonts-bug-kb-2670838-persists-ie11-and-windows-7-231035

i Haven't found any solutions to this subject yet.