我在下面创建了一个多级下拉菜单代码，但是有一个问题（第二级工作不正常）...
下面的 HTML 代码：
<nav>
<ul class="navigation">
<li><a href="#">Services</a>
<ul>
<li><a href="#">SHARED HOSTING</a><span>WHM/Cpanel</span></li>
<li><a href="#">EMAIL HOSTING</a><span>WEBMAIL</span></li>
<li><a href="#">BLOG HOSTING</a><span>WHM/Cpanel</span></li>
<li><a href="#">E-COMMERCE HOSTING</a><span>WHM/Cpanel</span></li>
<li><a href="#">FILE STORAGE HOSTING</a><span>WHM/Cpanel</span></li>
<li class="dropdown-submenu"><a href="#">RESELLER HOSTING</a><span>Private Nameservers</span>
<ul class="dropdown-menu">
<li><a href="#">SHARED HOSTING</a><span>WHM/Cpanel</span></li>
<li><a href="#">EMAIL HOSTING</a><span>WEBMAIL</span></li>
<li><a href="#">BLOG HOSTING</a><span>WHM/Cpanel</span></li>
<li><a href="#">E-COMMERCE HOSTING</a><span>WHM/Cpanel</span></li>
<li><a href="#">FILE STORAGE HOSTING</a><span>WHM/Cpanel</span></li>
<li><a href="#">RESELLER HOSTING</a><span>Private Nameservers</span></li>
</ul>
</li>
</ul>
</li>
</ul>
<!-- DROPDOWN SELECT MENU FOR SMALL SCREENS -->
<div class="medium button dropdown" style="">
Select
<ul class="no-hover" style="top: 35px;">
<li><a href="index-2.html"><strong>Home</strong></a></li>
<li><a href="shared-hosting.html"><strong>Web Hosting</strong></a></li>
<li><a href="shared-hosting.html">- Shared Hosting</a></li>
<li><a href="reseller-hosting.html">- Reseller Hosting</a></li>
<li><a href="vps.html"><strong>VPS</strong></a></li> <li><a href="dedicated-servers.html"><strong>Servers</strong></a></li>
<li><a href="index-2.html"><strong>Features</strong></a></li>
<li><a href="index-2.html">- Home Pricing Box</a></li>
<li><a href="index-content-slider.html">- Home Content Slider</a></li>
<li><a href="domain-names.html">- Domain Names</a></li>
<li><a href="typography.html">- Typography</a></li>
<li><a href="video-tutorials.html">- Video Tutorials</a></li>
<li><a href="photo-gallery.html">- Photo Gallery</a></li>
<li><a href="blog-category.html"><strong>Blog</strong></a>
</li><li><a href="blog-category.html">- Category</a></li>
<li><a href="blog-single-post.html">- Single Post</a></li>
</ul>
</div>
<!-- END OF DROPDOWN SELECT MENU FOR SMALL SCREENS -->
</nav>
CSS代码如下：
.navigation{ margin:0; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px;box-shadow: 0 0 14px 0px #e5e1e1; height:45px; background: url(../images/backgrounds/menubg.png) repeat-x; border: 1px solid #e5e1e1;}
nav { position: relative; font-size:13px; margin: 0px auto; width: 100%;}
nav ul {list-style-type: none; padding:0; margin:0;}
nav ul li {float: left; position: relative;border-right:1px solid #e9e9e9; width:20% }
nav ul li.last {border-right:0;}
nav ul li a {text-align: center;display:block;text-decoration:none;padding: 12px 0;color:#2d2d2d;}
nav ul li a:hover { color:#d94a38; background: url(../images/arrow.png) no-repeat 0% 50%;}
nav ul li.active a { color:#d94a38; background: url(../images/arrow.png) no-repeat 0% 50%;}
nav ul li ul {display: none}
nav ul li:hover ul {display: block;position: absolute;list-style-type: none;margin:0;padding:0;z-index:999; background-color: #fff;
-webkit-box-shadow: 0 1px 3px rgba(0,0,0,.1);
-moz-box-shadow: 0 1px 3px rgba(0,0,0,.1);
box-shadow: 0 1px 3px rgba(0,0,0,.1);
padding: 3px 12px;
border-top-width: 1px;
border-right-width: 1px;
border-bottom-width: 1px;
border-left-width: 1px;
border-top-style: solid;
border-right-style: solid;
border-bottom-style: solid;
border-left-style: solid;
border-top-color: #c12727;
border-right-color: #dfdfdf;
border-bottom-color: #dfdfdf;
border-left-color: #dfdfdf;}
nav ul li:hover ul li {
padding:8px 0;
border-top: 1px solid #efefef;
float: none;
background: none;
width:160px;
border-right:0;}
nav ul li:hover ul li span{
padding:0;
margin:0;
font-size:11px;
color:#ccc;}
nav ul li:hover ul li:first-child { border-top: none; }
nav ul li:hover ul li a {color:#2d2d2d; font-size:12px; padding:0; text-align: left; background:transparent;}
nav ul li:hover ul li a:hover {color:#c12727; background:transparent;}
nav ul li.last:hover ul li {border-right:0;width: 95px;}
nav .dropdown {display: none;}
我尝试将下面的代码添加到 css 但多级下拉菜单不起作用
.dropdown-submenu:hover > .dropdown-menu .dropdown-menu { display: none; }
.dropdown-submenu:hover .dropdown-submenu:hover > .dropdown-menu { display: block; }