Question

I am in ASP.NET, but the problem is completely HTML related. I have this following code:

<asp:Panel runat="server" CssClass="message-box">
    <asp:LinkButton ID="LogoutLinkButton" runat="server">Logout</asp:LinkButton>
</asp:Panel>

The equivalent HTML is:

<div class="message-box">
    <a href="#">Logout</a>
</div>

And the CSS classes are:

a {
    text-decoration: none;
    color: inherit; 
}

.message-box {
    width: 1000px;
    margin: 0 auto;
    text-align: right;  
}

.message-box a:hover {
    text-decoration: underline; 
    text-shadow: 0.1em 0.1em 0.2em black;
}

The demonstration can be found in jsFiddle.

This text-shadow of the anchor text is not working in IE8/ IE9. How can I achieve this?

Thanks.

Answer 1

text-shadow is a css3 property. so you can not user it in IE.
But you can user filter:shadow to meet you requirement