Question

Please, Find the jsfiddle demo here.

I want to take the navigation list at the bottom of green colored band.

Can anyone tell me which style will help me ?

Just adding code below:

<div id="navigation">
            <div id="navBar"> 
                <ul>
                    <li>Home</li>
                    <li>Application Tracker</li>
                    <li>Insurance Policy downloads</li>
                    <li>Parner Login</li>
                    <li>SiteMap</li>
                </ul>    
            </div>
</div>​

And style as below:

#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;
}​

Answer 1

Here is the one way:

http://jsfiddle.net/kKp6Z/2/

Use position: relative for container div and set position:absolute;bottom:0; for navBar.