Apply active CSS on Menus on Master Pages

In this blog you will learn how to apply active CSS on menus on Master Pages.

Introduction

Apply active CSS on menus on Master Pages from code behind without JavaSrcipt.

In our web applications

We face problems when using a Master Page. How to set the class for the active tab?

Here we can set active class

<ul>
     <li id="page1" runat="server" ><a href="studentHomePage.aspx"> Dashboard    </a></li>

      <li id="page2"  runat="server"><a href="Mytest.aspx">   My Test</a></li>

       <li id="page3"  runat="server"><a href="TestReport.aspx">Test Report</a></li>

        <li id="page4"  runat="server"><a href="Subscription_New.aspx">Subscribe</a></li>


 </ul>

Code Bheind

page_load
{
        String activepage= Request.RawUrl;
       if(activepage .Contains("studentHomePage.aspx"))
       {
            page1.Attributes("class") = "active";
       }
       else if(activepageactivepage .Contains("Mytest.aspx"))
       {
            page2.Attributes("class") = "active";
       }
          else if( activepage.Contains("TestReport.aspx") )
       {
            page3.Attributes("class") = "active";
          }
          else if( activepage.Contains("Subscription_New.aspx"))
       {
            page4.Attributes("class") = "active";
          }

}

Screen Shots

Tab 1



Tab 2