title: Hide navigation in _Layout.cshtml file when displaying the login screen
body: <p>I am relatively new to ASP.NET MVC so this problem has me stumped.</p>
  
  <p>When a client goes to my website they are presented with a login screen. I am using a layout/master page to keep the look consistent across the website. The problem is I don't want to display the navigation menu on the login page only subsequent pages after the client has logged in. </p>
  
  <p>I am using forms authentication so i do not want to set a persistent cookie due to the nature of the data/content for security reasons so i can't use:</p>
  
  <pre><code>@if(Request.isAuthenticated)
  {
     //display menu
  }
  
  else
  {
     //don't display menu
  }
  </code></pre>
  
  <p>The other problem with this solution that I had thought of is that if i'm hiding the nav bar then the content will not fill the entire height of the screen as i am using percentages. By this I mean that when the nav bar is hidden all content will move up and there will be a strip of empty space at the bottom.</p>
  
  <p>What is the best way to do this?. </p>
  
  <p>UPDATE: </p>
  
  <p>Based on solutions already provided I have got this working via the following:</p>
  
  <p><em>_Layout.cshtml file</em></p>
  
  <p>I set the Session["isAuthenticated"] variable upon login.</p>
  
  <pre><code> @if(Session["isAuthenticated"] != null)
              {
                  &lt;div id="navigation"&gt;
                      &lt;a href="#" id="menu_toggle"&gt; Show/Close Menu &lt;/a&gt;
                      &lt;nav&gt;
                          &lt;ul id="menu"&gt;
                              &lt;li&gt;&lt;a href="#"&gt; Accounts &lt;/a&gt;&lt;/li&gt;
                              &lt;li&gt;&lt;a href="#"&gt; Calculate/Sumbit Quote &lt;/a&gt; &lt;/li&gt;
                              &lt;li&gt;&lt;a href="#"&gt; Messages &lt;/a&gt;&lt;/li&gt;
                              &lt;li&gt;&lt;a href="#"&gt; Contact Us &lt;/a&gt;&lt;/li&gt;
                              &lt;li&gt;&lt;a href="#"&gt; Settings &lt;/a&gt;&lt;/li&gt;
                          &lt;/ul&gt;
                      &lt;/nav&gt;
                  &lt;/div&gt;
  
                  &lt;div id="normalContentContainer" class="content"&gt;
                      @RenderBody()
                  &lt;/div&gt;
              }
  
              else
              {
                  &lt;div id="loginContentContainer" class="content"&gt;
                      @RenderBody()
                  &lt;/div&gt;
              }
  </code></pre>
  
  <p><em>style sheet</em></p>
  
  <pre><code>.content
   {
    width: 100%;
    //min-height: 79%;
    background-color: #FFFFFF;
    padding: 10px 30px 20px 30px;
    border-top: 1px solid #CECCCC; 
    border-left: 1px solid #CECCCC; 
    border-right: 1px solid #CECCCC;
    //border-bottom: 3px solid #BABABA;
    margin-top: 0.4%;
  }
  
  #normalContentContainer
  {
    height: 73.3%;
  }
  
  #loginContentContainer
  {
     height: 79.3%;
  }
  </code></pre>
  
  <p>This works perfectly but is it considered good practice to do this sort of thing. </p>