Arquivo Discussoes de Programacao e Tecnologia Pessoal eu tenho a seguinte situação:
MENU PAI (possui os dois MENU 1 e2 )
.sub-menu li > ul {
display: none;
}
.sub-menu li:hover > ul{
display: block;
}
quanto o MENU 1 só possui 2 itens (li) seleciono o MENU 2 e seus filhos são exibidos, se eu aumento o número de itens no MENU 1 todo o MENU 1 e 2 são fechados, como seu o hover não funcionasse.
Alguma sugestão ?
Olá Gleyson,
Seu CSS está correto, mas talvez o problema esteja com a estrutura ul li.
Segue o código funcionando:
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
.sub-menu li > ul {display: none; }
.sub-menu li:hover > ul{display: block; }
</style>
<title></title>
</head>
<body>
<ul class="sub-menu">
<li>MENU 1
<ul>
<li>A</li>
<li>B</li>
<li>C</li>
<li>D</li>
</ul>
</li>
<li>MENU 2
<ul>
<li>E</li>
<li>F</li>
</ul>
</li>
</ul>
</body>
</html>