title: How to set background color for div in ASP.NET web page
body: <p>I am trying to design a web form in ASP.NET. In that I am trying to set a background color to different <strong><em>empty divs</em></strong>. Normally a simple html code like below works:</p>
  
  <pre><code>&lt;html&gt;
      &lt;head&gt;
          &lt;style&gt;
           #header{
               width:100%;
               height:20%;
               background-color:lightblue
           }
           #nav-bar{
               width:100%;
               height:5%;
               background-color:lightgreen;
           }
           body,html{
               margin:0;
           }
        &lt;/style&gt;
      &lt;/head&gt;
  &lt;body&gt;
      &lt;div id="header"&gt;
      &lt;/div&gt;
  
      &lt;div id="nav-bar"&gt;
      &lt;/div&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>But if I use this same snippet in ASP.NET, I fail to achieve the desired result. The browser displays nothing. My aspx code is as follows:</p>
  
  <pre><code>&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;
  
  &lt;html&gt;
      &lt;head runat="server"&gt;&lt;title&gt;&lt;/title&gt;
          &lt;style type="text/css"&gt;
              #header {
                  background-color: lightblue;
                  height: 20%;
                  width: 100%;
              }
  
              #nav-bar {
                  background-color: lightgreen;
                  height: 5%;
                  width: 100%;
              }
              body, html { margin: 0; }
          &lt;/style&gt;
      &lt;/head&gt;
      &lt;body runat="server"&gt;
          &lt;div id="header"&gt;
  
          &lt;/div&gt;
          &lt;div id="nav-bar"&gt;
  
          &lt;/div&gt;
      &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>So how can I set a background color to an empty div in ASP.NET? Any help would be much appreciated. Thanks!</p>