New to Telerik UI for ASP.NET AJAX? Download free 30-day trial

My CSS Rule Does Not Apply

My CSS rule does not apply

Q: How come that my CSS rule does not apply to the page?

A: 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:

<style type="text/css">
        color: red;
<telerik:RadMenu RenderMode="Lightweight" ID="RadMenu1" runat="server">
        <telerik:RadMenuItem Text="Home" CssClass="MyItem">

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:

.RadMenu_Default .rmLink { 
    line-height: 24px; 
    text-decoration: none;
    color: #fff;

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:
.RadMenu_Default .rmRootGroup .MyItem { 
    color : red;
  1. Use the "!important" modifier to force your setting:
    color : red !important; 
In this article
Not finding the help you need? Improve this article