title: Horizontal List at bottom of Div Block
body: <p>Please, Find the jsfiddle demo <a href="http://jsfiddle.net/kKp6Z/1/" rel="nofollow">here</a>. </p>
  
  <p>I want to take the navigation list at the bottom of green colored band. </p>
  
  <p>Can anyone tell me which style will help me ?</p>
  
  <p>Just adding code below:</p>
  
  <pre><code>&lt;div id="navigation"&gt;
              &lt;div id="navBar"&gt; 
                  &lt;ul&gt;
                      &lt;li&gt;Home&lt;/li&gt;
                      &lt;li&gt;Application Tracker&lt;/li&gt;
                      &lt;li&gt;Insurance Policy downloads&lt;/li&gt;
                      &lt;li&gt;Parner Login&lt;/li&gt;
                      &lt;li&gt;SiteMap&lt;/li&gt;
                  &lt;/ul&gt;    
              &lt;/div&gt;
  &lt;/div&gt;​
  </code></pre>
  
  <p>And style as below:</p>
  
  <pre><code>#navigation{
      height:290px;    
      background-color:olive;
      display:block;
      position:static;
  }
  #navBar {   
      height: 33px;
      width: 100%;
  }
  #navigation ul {
      background: -moz-linear-gradient(center bottom , #FCFCFC 25%, rgba(200, 200, 200, 0.8) 50%) repeat scroll 0 0 transparent;
      height: 32px;
      margin: 0;
      opacity: 0.6;
      padding: 0;
  }
  #navigation ul li {
      color: #302E2E;
      display: inline;
      font-size: 16px;
      margin: 10px;
      padding: 0;
  }​
  </code></pre>