1
这个下拉菜单有什么问题，我的问题是如何将子菜单置于垂直位置，如何设置样式并关闭子菜单，我试着用float：没有;请帮忙？？？？？？？？？？？CSS下拉菜单（如何将子菜单放在垂直位置）
.cf:before,
.cf:after {
content: " "; /* 1 */
display: table; /* 2 */
}
.cf:after {
clear: both;
}
.cf {
*zoom: 1;
}
nav {
background: #916a31;
height: 2.3em;
}
ul,
li {
margin: 0;
padding: 0;
list-style: none;
float: left;
}
ul {
background: #d5973c;
height: 2em;
width: 100%;
}
li a {
display: block;
line-height: 2em;
padding: 0 1em;
color: #fff;
text-decoration: none;
}
li a:hover {
background: #916a31;
height: 2em;
padding-top: .3em;
position: relative;
top: -.3em;
border-radius: .3em .3em 0 0;
}
.curent,
a:hover.curent {
background: #ad9b7f;
color: #eee;
padding-top: .3em;
position: relative;
top: -.3em;
border-radius: .3em .3em 0 0;
border-bottom: .3em solid #917f63;
}
ul.submenu {
float: none;
background: #916a31;
width: auto;
height: auto;
}
ul.submenu li {
float: none;
}
ul.submenu li a {
border-bottom: 1px solid white;
padding: .2em 1em;
white-space: nowrap;
}
ul.submenu li:last-child a {
border-bottom: none;
}<nav class="cf">
<ul>
<li> <a href="#" class="curent">Home</a> </li>
<li> <a href="#">News</a>
<ul class: "submenu">
<li> <a href="#">Podmeni1</a> </li>
<li> <a href="#">Podmeni2</a> </li>
<li> <a href="#">Podmeni3</a> </li>
</ul>
</li>
<li> <a href="#">About</a> </li>
<li> <a href="#">Contact</a> </li>
</ul>
</nav>