Having an issue with Internet Explorer not displaying my background clipped text correctly. In other browsers like Chrome and Firefox, the code renders fine:
https://i.stack.imgur.com/x9lio.png
However, in IE it appears differently:
Your code:
HTML:
<div id="centerArt">
Hi, Visitor!
</div>
CSS:
#centerArt{
font-family:"Arial", Arial, sans-serif;
font-weight: bold;
font-size: 100px;
line-height: 150px;
background-color: #565656;
color: transparent;
text-shadow: 0px 2px 3px rgba(255,255,255,0.3);
-webkit-background-clip: text;
-moz-background-clip: text;
background-clip: text;}
Any suggestions on how to make IE behave properly? :)
Thank you!