Css – Master Pages.. and applying a css classes to the body element


I have a master page which a generic a menu that looks like this:

<div id="menu">
<ul class="sf-menu">
    <li class="menuHome"><a href="/home">Home</a></li>
    <li class="menuBandsAZ"><a href="/artist/list">Bands</a></li>
    <li class="menuGigs"><a href="/gig/list">Gigs</a></li>
<asp:ContentPlaceHolder ID="ListingPlaceHolder" runat="server"></asp:ContentPlaceHolder>

I want to apply a css class to the body element defined in the masterpage so that I can highlight the menu item which represents the page the user is viewing.

How would you guys suggest I do this?

Since I'm using asp.net MVC I could adding a "section" property to my BaseViewModel which the Masterpage could use to determine which css class to apply to the body element.

However, I'd prefer to be able to specify in the views which section they represent since it may be easier to maintain imo.

Any suggestions?

Best Solution

I'd put the menu in a user control, in each page, I'd render the user control with a model representing the selected item. The user control will render the menu appropriately by looking at the model passed to it.