所以我正在做一个网站......我想要一个像http://forever21.com这样的下拉导航，但我似乎无法修复我的......它与整个导航 div 重叠。请帮忙！这是我的代码：
` nav li .first{border-right:left: 1px dotted #ddd; }
nav ul ul {
display: none;
}
nav ul li:hover > ul {
display: block;
}
nav ul {
list-style: none outside none;
position: relative;
display: inline-table;
margin-top: -18px;
margin-left: 31px;
}
nav ul:after {
content: ""; clear: both; display: block;
}
nav ul li {
float: left;
list-style: none outside none;
display: inline;
color: rgb(68, 68, 68);
border-right: 1px dotted rgb(221, 221, 221);
font-size: 20pt;
font-family: "Questrial",arial,sans-serif;
padding: 20px 17px 10px 20px;
margin-top: -17px;
}
nav ul li:hover {
background: #4b545f;
color: #fff;
}
nav ul li a {
list-style: none outside none;
display: inline;
letter-spacing: 2px;
font-size: 11px;
text-transform: uppercase;
color: #444444;
padding-top:20px;
}
nav ul ul li {
border-top: 1px solid #6b727c;
border-bottom: 1px solid #575f6a;
display: block;
position: relative;
}
nav ul ul li a {
color: #000;
}
nav ul ul li a:hover {
background: #4b545f;
}
HTML:
<nav>
<ul>
<li><a href="http://tiniglesias.shericaocbania.org/about">About <img src="http://icons.iconarchive.com/icons/visualpharm/ios7/16/arrow-down-4-icon.png" width="9" /> </a>
<ul>
<li class="sub" ><a href="#">ABOUT ME</a></li>
<li class="sub" ><a href="#">F.A.Q</a></li>
<li class="sub" ><a href="#">PRESS</a></li>
</ul></li>
<li><a href="http://tiniglesias.shericaocbania.org">Blog <img src="http://icons.iconarchive.com/icons/visualpharm/ios7/16/arrow-down-4-icon.png" width="9" /> </a>
<ul>
<li><a href="#">ART & DESIGN</a></li>
<li><a href="#">BEAUTY</a></li>
<li><a href="#">D-I-Y & TUTORIAL</a></li>
<li><a href="#">FASHION & STYLE</a></li>
<li><a href="#">LIFESTYLE</a></li>
<li><a href="#">TRAVEL</a></li>
</ul>
</li>
<li><a href="http://tiniglesias.shericaocbania.org/shop">Shop </a></li>
</ul>
</nav>
`
有人可以帮帮我吗，我知道...这是一个小问题，但直到现在仍然找不到这些导航 dropdowsn huhuhu 背后的正确逻辑。
谢谢！