My CSS rule does not apply
Most probably there is a more concrete CSS rule (usually defined in the skin) which overrides your settings. Let's assume you have defined a custom CSS class and you want to apply it to a specific menu item:
| |
 Copy Code |
|
<style type="text/css">
.MyItem
{
color:red;
}
</style>
<rad:RadMenu runat="server" id="RadMenu1" Skin="CssBlue">
<Items>
<rad:RadMenuItem Text="Item 1" CssClass="MyItem" />
</Items>
<rad:RadMenu>
|
The foreground color of that menu item won't change. There is a more concrete CSS rule in the skin which overrides the "color" CSS property:
| |
Copy Code |
|
.RadMenu_CssBlue .link
{
text-decoration:none;
color: black;
line-height: 20px;
border-bottom: 2px solid #a7cfe8;
border-top: 3px solid #a7cfe8;
}
|
To make your CSS setting apply you can use one of the following techniques:
1. Make your CSS rule more concrete than the one from the skin:
| |
Copy Code |
|
.RadMenu_CssBlue .rootGroup .MyItem
{
color:red;
}
|
2. Use the "!important" modifier to force your setting:
| |
Copy Code |
|
.MyItem
{
color:red !important;
}
|
See Also