[RESOLVED]Link colour and underline question

Hello

I am trying to add style to the following LinkButton:

<asp:LinkButton runat="server" CssClass="labelStyle1" OnClick="LinkButton_Click" >Log out</asp:LinkButton>

In my <style> tags, I have:

.labelStyle1 {
font: normal 14px 'Droid Sans','Trebuchet MS', Arial, sans-serif;
color:#ffffff;
float: right;
position:absolute;
top: 55px;
right: 100px;
text-decoration: none;
height: 16px;
}

 .labelStyle1 a:hover {
      text-decoration: underline;
      color:#ffffff;
    }

The text appears as white. When I hover the mouse over it an underline appears, which is what I want, but the text is a blue colour even though I have defined it as #ffffff.

What is preventing it from remaining white, please?

Thanks.

Change your css style like given below

.labelStyle1
        {
            font: normal 14px 'Droid Sans' , 'Trebuchet MS' , Arial, sans-serif;
            color: #ffffff;
            float: right;
            position: absolute;
            top: 55px;
            right: 100px;
            text-decoration: none;
            height: 16px;
        }
        
        .labelStyle1:hover
        {
            text-decoration: underline;
            color: #ffffff !important;
        }

That works now, thanks!

And just on account of that: !important; Strange that the attribute needs to be emphasised in that way, but it did the trick!

Thanks again!

Bluenose

And just on account of that: !important; Strange that the attribute needs to be emphasised in that way, but it did the trick!

Actually the problem was not adding the !important attribute , the problem lies with the statement 

 .labelStyle1 a:hover {

where you dont need the ‘a’ anchor tag selector in the css style as you have directly applied css styles to your linkbutton.

Having said this I would recommend adding the !important attribute always when you want your css to take priority over default css.

Oh, OK.

Yes !important seems to be quite, well, important.

Thanks again.

Leave a Reply