CSS – frustrating menu item “selected_page”

for days I have been attempting to apply a color to the selected page in the main menu on a new site I am making. So far it has been able to resist any attempt to change.

I am fairly sure that the the following css tags are responsible for this, however adding a “color” does not help in any way. Firebug tells me that it is using the generic color given to it by “a”, however that the correct class “li.selected_subpage” is also applied.

Read More
#menu-wrap li.selected_page{    
    line-height:20px;
    color: #F00;  (ignored)
}

I am at wit’s end, anybody have an idea? Thanks!

On a subnote, I would also like to apply a box shadow to the sub-menu, however what it does on this menu is apply it to ever item in the list, not just around all of the items. If anyone has an idea where to apply the box-shadow I would be greatful too. Thanks!

Related posts

Leave a Reply

1 comment

  1. I think your color choice is overridden by this block in your style.css:

    a:link {
        color: #333333;
        text-decoration: none;
    }
    

    change your code to:

    #menu-wrap li.selected_page a:link {    
        line-height: 20px;
        color: #F00;
    }
    

    and make sure you put it somewhere after the a:link block.