<div id=”content”>
<div id=”col_1″>
<div id=”letter-menu”>
<navl>
<ul>
<li>
<a>aaa</a>
<ul>
<li>
<a>bbbb</a>
<ul>
<li>
<a>ccccc</a>
</li>
<li>
<a>dddddd</a>
</li>
</ul>
</li>
<li>
<a>eeee</a>
<ul>
<li>
<a>ffff</a>
</li>
<li>
<a>gggg</a>
</li>
</ul>
</li>
</ul>
</li>
</ul>
</navl>
</div>
</div>
</div>
<style type=”text/css”>
*{padding:0;margin:0;}
navl a:link, navl a:visited{
color: #B3B3C1;
}
navl ul ul {
display:none;
}
navl ul li:hover > ul {
display:block;
}
navl ul {
padding: 0;
margin: 0px 0px 15px 0px;
list-style: none;
position: relative;
display: inline-table;
z-index:1000;
}
navl ul li {
float: left;
}
navl ul li:hover {
background: #FFFFFF;
}
navl ul li:hover a {
background-color: #175581;
color: #FFFFFF;
}
navl ul li a {
display: block;
padding: 1px 5px;
border: solid 1px #B3B3C1;
margin-right: 5px;
width: 10px;
text-decoration: none;
}
navl ul ul {
top: 22px;
width: 120px;
background: #F5F5FA;
}
navl ul ul li {
float: none;
position: relative;
}
navl ul ul li a {
padding: 5px;
color: #fff;
width: 150px;
background: #FFFFFF;
border: 1px solid #B3B3C1;
}
navl ul ul li a:hover {
background: #F5F5FA;
color: #175581;
}
navl ul ul ul {
position:absolute;
margin-top:-1.4em;
left: 161px;
width: 120px;
background: #F5F5FA;
}
navl ul ul ul li {
float: none;
position:relative;
display:block;
}
navl ul ul ul li a {
padding: 5px;
color: #fff;
width: 150px;
background: #FFFFFF;
border: 1px solid #B3B3C1;
}
navl ul ul ul li a:hover {
background: #F5F5FA;
color: #175581;
}
#content {
float: left;
padding: 0 15px;
width: 720px;
margin-bottom: 15px;
}
#col_1 { float: left; width: 720px; }
</style>
我把你的html结构改了一下,css也有变化,请你和你的原代码对照一下看看变化吧