Si8
Si8

Reputation: 9225

How to assign a pre-defined style to a asp:BulletedList link

I have some link styles in my stylesheet:

a.whiteLinks {
    color: #FFFFFF;
    text-decoration: none;
}
a.blueLinks {
    color: #0076AC;
    text-decoration: none;
}
a.whiteLinks:hover {
    color: #5397AD;
    text-decoration: none;
}
a.blueLinks:hover {
    color: #5397AD;
    text-decoration: none;
}

I have the following asp:BulletedList

<asp:BulletedList DisplayMode="HyperLink" runat="server" ID="blFirst" ClientIDMode="Static">
     <asp:ListItem Value="allergy.aspx">Allergy and Immunology</asp:ListItem>
     <asp:ListItem Value="">Anesthesiology</asp:ListItem>
     <asp:ListItem Value="">Breast Surgery</asp:ListItem>
</asp:BulletedList>

Where can I edit so the links inside the bulleted list uses the blueLink style rather than the default one?

I tried to add CssClass="blueLinks" in the BulletedList but it didn't have any affect.

Upvotes: 0

Views: 56

Answers (1)

LOTUSMS
LOTUSMS

Reputation: 10240

change the class to

.blueLinks li a {
   color: #0076AC;
   text-decoration: none;
}

and adjust the hover as well so that you also have that mapped the right way

 .blueLinks li a:hover {
     color: #5397AD;
     outline:none; /* add this. ASP has the bad habit of adding outline to links in IE */
     text-decoration: none; /* You don't need this.  */
  }

*YOUR FIDDLE *

Upvotes: 1

Related Questions