Navigation

html

<div id="nav">  
  <ul>
      <li><a href="index.php">#</a></li>
      <li><a href="seditio/">Релизы</a>
          <ul>
              <li><a href="seditio/">Релизы</a></li>
              <li><a href="plugins/">Плагины</a></li>
              <li><a href="skins/">Скины</a></li>
              <li><a href="docs/">Документация</a></li>
              <li><a href="forums/">Форумы</a></li>  
          </ul>
      </li>
      <li><a href="plugins/">Плагины</a></li>
      <li><a href="skins/">Скины</a></li>
      <li><a href="docs/">Документация</a></li>
      <li><a href="forums/">Форумы</a></li>
      <li><a href="contact/">Контакты</a></li>
  </ul>
</div> 

css

#nav {
	clear: both;
	z-index: 2;
	overflow: hidden;
	margin-bottom: 1.5em;
	background: #303030;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
}

#nav ul {
	list-style: none;
	margin: 0;
  padding:0; 
}

#nav ul li {
	float: left;
	margin: 0;
	text-align: center;
}

#nav ul li:first-child a {
	border-left: none;
}

#nav ul li.last a, #nav ul li.last span {
	border-right: none;
}

#nav ul li a, #nav ul li span {
	vertical-align: baseline;
	line-height: 4em;
	padding: 0 24px;
	text-decoration: none;
	color: #ffffff;
	display: block;
	background: url("img/navigation-divider.png") no-repeat right 50%
}

#nav ul li a:hover {
	color: #fff !important;
	background: #336699; 
}

#nav ul li span {
	color: #888;
	padding: 0 23px;
	text-shadow: none;
	background: #f8f8f8;
}


#nav ul li ul {
	display: none;
  width: 210px;
	z-index: 100;
  margin:0;
  padding:0;  
} 

#nav ul li:hover ul, #nav ul li.hover ul {
	display: block;
	position: absolute;
	z-index: 1000;
	text-align:left; 
}

#nav ul li:hover ul li, #nav ul li.hover ul li {
	float: none;
	width: 210px;
  margin:0;
  text-align:left;
  display:inline;
  background: #303030;
}

#nav ul li:hover ul li a, #nav ul li.hover ul li a {
  background: #303030;
	line-height: 3em;
	padding: 0 24px;  
}

#nav ul li:hover ul li a:hover, #nav ul li.hover ul li a:hover {
	color: #fff !important;
	background: #336699; 	
}

#nav ul li:hover ul li:last-child a, #nav ul li.hover ul li:last-child a
{
  -webkit-border-bottom-right-radius: 5px;
  -webkit-border-bottom-left-radius: 5px;
  -moz-border-radius-bottomright: 5px;
  -moz-border-radius-bottomleft: 5px;
  border-bottom-right-radius: 5px;
  border-bottom-left-radius: 5px;
}

jquery hover (for old browser aka IE :) )

$("#nav ul li").hover(
  function() {
    $(this).addClass("hover");
  }, function() {
    $(this).removeClass("hover");
  }
);