How do i make the menu selected item have a different color? tabbed menu ASP.NET MVC

basilmir

How do i make the menu selected item have a different color? tabbed menu I am using the ASP.NET MVC default template. Well i want the menu i'm in to have a different color. Found this in the css but it does not produce any results. I've searched around the web, most people have solutions that require you to modify the menu alltoghether, having a variable to keep "tabs" on what is selected. Why isn't this working by default? ul#menu li.selected a { background-color: #fff; color: #000000; }

m khansari

Hi You can use this css code

ul#menu li a:Hover

{

background-color: #fff;

color: #000000;

}

I dont understand what you mean in this code

ul#menu li.selected a

{

background-color: #fff;

color: #000000;

}

I think that LI element does not have selecting capability If you want to use Pseudo-class you should write like

ul#menu li:selected

but I am not sure that selected be a Pseudo-class

Mohammad Khansari

Jim G

I stumbled over this too. In order to use the "selected" style for the tab in the standard MVC site.css file, you need to have the selected class be assigned to the <li> rather than the <a> tag.

ul#menu li.selected a
{
background-color: #fff;
color: #000000;
}

So to show the About item selected, for your menu use: