Die Navigation

Die css für die Navigation

 #nav ul {
 margin: 0;
 padding: 0;
 list-style-type: none;
 height: 32px;
}

#nav ul li {
 float: Left;
 width: 152px;
 position: relative;
}

#nav ul li a {
 display: block;
 width: 130px;
 line-height: 30px;
 text-align: center;
 color: #FFFFFF;
 text-decoration: none;
 background-color: #EA9531;
 border: 1px Solid #FFFFFF;
}

#nav ul li a:hover {
 color: #333333;
}

#nav ul li ul {
 display: none;
 position: absolute;
 left: 0px;
 top: 32px;
 z-index: 100;
}

#nav ul li:hover ul {
 display: block;
}

#nav ul li ul a {
 background-color: #FFB33B;
}
	   

Das html gerüst für die Navigation

	   
<div id="nav">
 <ul>
  <li><a href="#">Link 1</a></li>
  <li><a href="#">Link 2</a>
       <ul>
        <li><a href="#">Link 2.1</a></li>
        <li><a href="#">Link 2.2</a></li>
       </ul>
  </li>
  <li><a href="#">Link 3</a>
       <ul>
        <li><a href="#">Link 3.1</a></li>
        <li><a href="#">Link 3.2</a></li> 
        <li><a href="#">Link 3.3</a></li>
       </ul>
  </li>
  <li><a href="#">Link 4</a>
       <ul>
        <li><a href="#">Link 4.1</a></li>
        <li><a href="#">Link 4.2</a></li>
        <li><a href="#">Link 4.3</a></li>
        <li><a href="#">Link 4.4</a></li>
       </ul>
  </li>
 </ul>
</div>