Asp.Net Mvc Add Css Classes To The Body Element

Michael Herndon — Thu, 15 Oct 2009 07:00:42 +0000

Using the css classes on the body tag/element, you can open a door to having finer control over the layout of your site. Its one of the few decent tricks that bigger Content/Course Management Software like drupal or moodle provides.

In Asp.Net Mvc this can be done in the master page, outside of the head tags. What makes this nice is using the controller and action name to isolate the page and section of the site you are int.


<%
        var values = Html.ViewContext.RouteData.Values;
        var bodyClasses = values["controller"] + " " +
                        values["action"];
%>

// in the master page
 

// what should be rendered for the url: /blog/edit/5

As you can see above, it would pay off to stick to using the controller and action keywords in your routing. You could adjust the above for adding the modules/areas name.

.blog aside.column {
        display: none;
}

.blog.edit  footer {
        margin-top: 20px;
        background: transparent(images/egg.png) no-repeat;
}

You can now target certain aspects of the layout and change it depending what section of the site you are in.

amptools » tag

Asp.Net Mvc Add Css Classes To The Body Element