Position:absolute no Opera
Estou tendo um pequeno problema com position:absolute no Opera.
Sei que position:absolute deve ser usado com cautela e estou até pensando em alguma outra solução, mas por enquanto somente com ele consigo o que eu quero.
Se for preciso um exemplo online eu dou um jeito, mas eu acho que nem será necessário.
O problema é o seguinte:
estou usando o seguinte código:
<div id="menu">
<ul>
<li><a href="#" onmouseover="java script:desce('submenu1');">LINK 1</a></li>
<li><a href="#" onmouseover="java script:sobe();">LINK 2</a></li>
<li><a href="#" onmouseover="java script:desce('submenu2');">LINK 3</a></li>
<li><a href="#" onmouseover="java script:sobe();">LINK 4</a></li>
</ul>
</div>
<div id="submenu1" onmouseout="java script:sobe('submenu1');">
<ul>
<li><a href="#">Sub-Link 1</a></li>
<li><a href="#">Sub-Link 2</a></li>
<li><a href="#">Sub-Link 3</a></li>
</ul>
</div>
<div id="submenu2" onmouseout="java script:sobe('submenu2');">
<ul>
<li><a href="#">Sub-Link 4</a></li>
<li><a href="#">Sub-Link 5</a></li>
<li><a href="#">Sub-Link 6</a></li>
</ul>
</div>
com o CSS:
#menu {
float:left;
width:283px;
height:20px;
background:#999999;
margin:20px 5px 5px 0px;
font-family:Arial, Helvetica, sans-serif;
font-size:10px;
line-height:20px;
}
#submenu1, #submenu2 {
clear:both;
display:none;
height:20px;
position:absolute;
top:135px;
left:0px;
margin:0px;
padding:0px 10px 5px 0px;
}A idéia é que ao passar o Mouse no LINK1 ou LINK3, aparecam os submenu 1 ou 2.
Isso está funcionando perfeitamente em todos os browsers.
O problema é que no Opera, o #submenu aparece MUITO mais pra baixo do que no IE (6 e 7) e no FFox, onde aparece tudo normalzinho.
Alguma luz?
Discussão (1)
Carregando comentários...