CSS-Design - Drop Down Menü?

<ul>
   <li><a href="#">main 1</a></li>
   <li><a href="#">main 2</a>
   <ul>
      <li><a href="#">sub 2.1</a></li>
      <li><a href="#">sub 2.2</a></li>
   </ul>
   </li>
</ul>

<ul>
   <li class="nav_element"><a href="#" class="menu"><span>main 1</span></a></li>
   <li class="nav_element"><a href="#" class="menu"><span>main 2</span></a></li>
   <li class="nav_element subpage"><a href="#" class="menu"><span>sub 2.1</span></a></li>
   <li class="nav_element subpage"><a href="#" class="menu"><span>sub 2.2</span></a></li>
</ul>

#nav_container ul ul {
   display: none;
   position: absolute;
   width: 150px;
   top: 35px;
   left: 0;
   right: auto;
   float: left;
}
#nav_container ul ul li {
   width: 100%;
   margin: 0;
   left: auto;
   clear: left;
   float: left;
}
#nav_container ul ul li a,
#nav_container ul li.checked_menu li a,
#nav_container ul li:hover ul li a {
   width: 100%;
   line-height: 16px;
   float: left;
   border-radius: 0;
   border-bottom: 1px solid #ccc;
   background: url('http://img.webme.com/pic/d/dennis14e/subitem.png') repeat-x;
}
#nav_container ul ul li a:hover,
#nav_container ul li.checked_menu ul li a:hover,
#nav_container ul li:hover ul li a:hover {
   color: #440407;
   float: left;
}
#nav_container ul li:hover ul {
   display: block;
}