我做了一个 CSS 下拉菜单，问题是当我将鼠标悬停在“Men”上，然后悬停在出现的下拉菜单上时，“men”上的悬停效果消失了。这是代码。有人可以帮我解决这个问题吗？
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style>body, ul{ padding:0; margin:0; font-family: 'ambleregular';}
*{ margin:0; padding:0;}
ul{ margin:0; padding:0;}
li{ margin:0; list-style:none;}
a, img{ border:none;}
.cb{ clear:both;}
.fl{ float:left;}
.fr{ float:right;}
@font-face {
font-family: 'ambleregular';
src: url('../fonts/amble-regular_0-webfont.eot');
src: url('../fonts/amble-regular_0-webfont.eot?#iefix') format('embedded-opentype'),
url('../fonts/amble-regular_0-webfont.woff') format('woff'),
url('../fonts/amble-regular_0-webfont.ttf') format('truetype'),
url('../fonts/amble-regular_0-webfont.svg#ambleregular') format('svg');
font-weight: normal;
font-style: normal;
}
header, footer, aside, section, hgroup{ display:block;}
.number{ float:right; color:#81d300; font-size:23px; line-height:41px;}
.wrap{ width:986px; margin:0 auto;}
header{ width:100%; background-color:#000; color:#fff; float:left; padding:10px 0;}
.header_inner{ width:100%; float:left;}
.logo{ width:421px; float:left;}
.header_right{ width:565px; float:left; font-size:15px; font-family: 'ambleregular';}
.header_right ul.headerbottom li{ float:right; text-align:right; width:100%;}
.header_right ul.headertop{ width:100%; float:left;}
.header_right ul.headertop li{ float:right; line-height:30px; padding:0 5px;}
.header_right ul.headertop li a{ float:left; color:#fff; text-decoration:none;}
.header_right ul.headertop li a.mycart{ float:left; background-color:#81d300; padding:5px; color:#000; font-weight:bold;}
a.mycart span.cartimage{ background:url(../img/sprite1.png) right top no-repeat; height:25px; width:28px; float:left;}
.headerbottom ul li.ht{ height:40px;}
span.call{ width:14px; height:40px; margin-right:7px; display:block; float:right; background:url(../img/sprite1.png) left top no-repeat;}
.headerbottom ul li.bullet{ height:12px; background:url(../img/sprite1.png) left top no-repeat;}
.logo img{ margin-top:25px;}
.searchh_outer{ width:100%; float:left; margin-top:10px;}
.searchh{ background-color:#000; width:428px; margin:0 auto 0 auto; padding:5px;}
.searchh input[type="text"]{ height:28px; padding:0 3px; width:338px; float:left; border:none; line-height:28px; background-color:#FFFFFF; border-radius:2px; -moz-border-radius:2px; -webkit-border-radius:2px; margin:0; padding:0; font-weight:bold; color:#888;}
.searchh input[type="button"]{ padding:4px; border:none; background-color:#ff9c00; color:#fff; height:28px; line-height:28px; float:left; cursor:pointer;}
span.searchhimg{ margin-left:10px; float:left; background:url(../img/sprite1.png) right -38px no-repeat; background-color:#ff9c00; height:28px; width:22px;}
nav{ width:100%; margin-top:8px; background-color:#000000; float:left;}
nav ul li{ padding:4px 40px 0px 40px; float:left;}
nav ul li a { color:#fff; font-weight:normal; padding:0 20px; float:left; font-family:17px; text-decoration:none; line-height:30px;}
nav ul li a:hover{ background-color:#fff; color:#000; border-radius:3px 3px 0 0 ;}
nav ul li:hover > ul { display:block; width:100%; background-color:#e7e7e7;}
nav ul{ position:relative;}
nav ul ul{ display:none; left:0; top:30px; position:absolute;}
nav ul ul.division1{ width:328px !important; float:left; min-height:237px;}
nav ul ul.division2{ width:328px !important; float:left; margin-left:328px; min-height:237px;}
nav ul ul.division3{ width:328px !important; float:left; margin-left:656px; min-height:237px;}
nav ul ul li, nav ul ul li a{ float:none; position:relative;}
nav ul ul.division1 li, nav ul ul.division2 li, nav ul ul.division3 li{ display:block; width:328px;}
nav ul ul li a{ color:#383838; font-size:15px !important; padding:0;}
nav ul ul li a:hover{ color:#111; background:none;}
.dropdowntitle{ color:#0066d8; font-weight:bold; background-color:#FFFFFF}
.bluelink{ color:#0066d8; font-weight:bold;}
.bluelink:hover{ color:#004ca1;}
nav ul li a.chris{ font-size:21px; color:#ee1a26;}</style>
</head>
<body>
<!-- header start -->
<header>
<div class="wrap">
<div class="header_inner">
<div class="logo"><img src="img/logo.jpg" alt="some logo"></div>
<div class="header_right">
<ul class="headertop">
<li><a class="mycart"><span class="cartimage"></span> (0 items)</a></li>
<li><a href="#">Stores</a></li>
<li>|</li>
<li><a href="#">My Account</a></li>
<li>|</li>
<li> <a href="#">Wishlist</a></li>
<li>|</li>
<li><a href="#">Help</a></li>
</ul>
<ul class="headerbottom">
<li class="ht"><span class="number">(877) 370-1311</span><span class="call"></span></li>
<li class="bullet">FREE SHIPPING ON ALL U.S. ORDERS OVER $75</li>
<li>FREE RETURNS ON ALL U.S. ORDERS</li>
</ul>
</div>
</div>
</div>
</header>
<!-- header end -->
<!-- search start -->
<section class="searchh_outer">
<div class="searchh"><input type="text"><span class="searchhimg"></span><input type="button" value="Search"><div class="cb"></div></div>
</section>
<div class="wrap"><nav><ul>
<!-- men start --><li><a href="#">Men</a>
<!-- dropdown start -->
<ul class="division1">
<li class="dropdowntitle"><a href="#" class="bluelink">Top Categories </a></li>
<li><a href="#">Long Sleeve Woven Shirts </a></li>
<li><a href="#">Short Sleeve Woven Shirts</a></li>
<li><a href="#">Summer Mens Short Sleeve Woven</a> </li>
<li><a href="#">T-Shirts </a></li>
<li><a href="#">Pants</a> </li>
<li><a href="#" class="bluelink">View All Categories</a> </li>
</ul><ul class="division1">
<li class="dropdowntitle"><a href="#" class="bluelink">Top Categories </a></li>
<li><a href="#">Long Sleeve Woven Shirts </a></li>
<li><a href="#">Short Sleeve Woven Shirts</a></li>
<li><a href="#">Summer Mens Short Sleeve Woven</a> </li>
<li><a href="#">T-Shirts </a></li>
<li><a href="#">Pants</a> </li>
<li><a href="#" class="bluelink">View All Categories</a> </li>
</ul><ul class="division2">
<li class="dropdowntitle"><a href="#" class="bluelink">Top Brands </a></li>
<li><a href="#">DaVinci</a> </li>
<li><a href="#">Lennon/McCartney</a> </li>
<li><a href="#">Scott Weiland </a></li>
<li><a href="#">John Lennon </a></li>
<li><a href="#">Rock & Roll Relgion</a></li>
<li><a href="#" class="bluelink">View All Categories</a> </li>
</ul><ul class="division3">
<li class="dropdowntitle"><a href="#" class="bluelink">Top Categories </a></li>
<li><a href="#">Suits and Blazers</a> </li>
<li><a href="#">Jeans </a></li>
<li><a href="#">Ties </a></li>
<li><a href="#">Jackets </a></li>
<li><a href="#">Scarves</a></li>
</ul>
</li>
<!-- men end -->
<!-- dropdown end -->
<li><a href="#">Women</a></li>
<li><a href="#">Sale</a></li>
<li><a href="#">Gift Card</a></li>
<li><a href="#" class="chris">Christopher Wicks</a></li>
</ul></nav></div>
<section class="wrap">
<!-- header start -->
<section class="maincontent">
</section>
<div class="cb"></div>
</section>
</body>
</html>