I have encountered a strange issue which is rendering parts of my website in a blurry way. I never noticed this before after Windows decided to restart itself and do an update!
This is an example:
As you can see the 1px border around the button becomes blurry a little way in from the left and the text is also blurry.
Does anyone know what could cause this? I have not changed any setting on my PC. The above screenshot is in from Chrome. FireFox seems to be ok.
I’ve checked in Chrome on another PC and it seems fine. As far as I remember, it didn’t render like that before as I would have noticed something like that when coding it.
Have you tried removing elements of your CSS one at a time to see if that makes any difference, eg the box-shadow and transition? I don’t know why it should make a difference but could be worth a try…
You can see that the “e” on the left is sharper than the “e” on the right. Also on the sub heading it becomes more blurred to the right of the sentence.