标记:
<div id="topMenu"
<ul class="topnav">
<li class="misReservas"><a title="" href="#" class="misReservas"><span>MIS RESERVAS</span></a></li>
<li class="misOfertas"><a title="" href="#" class="misOfertas"><span>MIS OFERTAS</span></a></li>
<li class="miCuenta"> <a title="" href="#" class="miCuenta" id="miCuenta"><span>MI CUENTA</span></a>
<ul class="subnav submenuMiCuenta" style="display: none;">
<li class="first"><a href="#" title=""><span>MIS PUNTOS</span></a></li>
<li class="last"><a href="#" title=""><span>MI PERFIL</span></a></li>
</ul>
</li>
<li class="misVentajas"> <a title="" href="#" class="misVentajas"><span>MIS VENTAJAS</span></a></li>
<li class="nuestrosHoteles"><a title="" href="#" class="nuestrosHoteles"><span>NUESTROS HOTELES</span></a></li>
<li class="nuestrosPartners"> <a title="" href="#" class="nuestrosPartners" id="nuestrosPartners"><span>NUESTROS PARTNERS</span></a> </li>
</ul>
</div>
#topmenu的相关CSS:
#topmenu ul{
list-style: none;
display:block;
}
#topmenu li{float:left;height:50px;}
#topmenu li a{
margin:0;
padding:0;
text-decoration:none;
text-indent:0;
background:none !important;
width:auto;
padding-bottom:5px;
}
#topmenu li a span{
color: #EEEEFF !important;
cursor: pointer;
float: left;
font-family: 'Cabin',Arial;
font-size: 14px;
height: 24px;
letter-spacing: 0.2px;
text-align: center;
text-decoration: none;
margin-top: 9px;
padding: 15px 16px 5px 16px;
display:inline-block;
background:none;
}
.subNav的CSS
#topmenu li ul.subnav {
display: none;
left: 0px !important;
position: absolute !important;
top: 50px !important;
z-index: 1000 !important;
width: 98.9% !important;
}
#topmenu li ul.subnav li{
clear: both;
display: inline;
float: left;
height:33px;
margin:0px;padding:0px;
width: 100%;
}
#topmenu li ul.subnav li a {
margin:0;
padding: 0;
float:left;
height:33px;
display:inline-block;
width:100%;
background: url("../nImg/spriteMas.png") no-repeat scroll right -430px transparent !important;
_background:#65ABE7;
}
问题在于使用position:absolute;left:0px;
这个位置不是我期望的位置:我希望它是定位的.miCuenta偏移和尊重它的大小< / strong>,但这样的事情就是我得到的:
知道我做错了什么吗?我没有在px中指定任何宽度或任何我认为它应该是完美的......
答案 0 :(得分:1)
如果要将position:absolute
提供给元素,请将position:relative
定义为parent
。
在您的问题中,您将position:absolute
定义为#topmenu li ul.subnav
,因此您已将position:relative
定义为parent
#topmenu li
这样写:
#topmenu li{
position:relative;
}