Andrew Marques 47 Denunciar post Postado Abril 19, 2013 HTML: <div class="menu"> <ul> <li><a href="#">Visão Geral</a></li> <li><a href="#">Cadastros <img src="img/seta_submenu.png" alt="" /></a> <ul class="submenu"> <li>teste<li> </ul> </li> <li><a href="#">Ordem de Serviço</a></li> <li><a href="#">Fluxo de Caixa</a></li> <li><a href="#">Vendas <img src="img/seta_submenu.png" alt="" /></a></li> </ul></div> CSS: /* MENU */.menu{ float:left; margin-left:25px; margin-top:43px;}.menu ul li{ float:left; display:inline; margin-right:7px; position:relative;}.menu ul li a{ float:left; padding:10px 15px 10px 15px; border:1px solid #C8D3DD; border-bottom:none; border-top-left-radius:3px; border-top-right-radius:3px; background:-webkit-linear-gradient(rgb(255,255,255) 0%, rgb(226,231,237) 6%, rgb(226,231,237) 100%); color:#395A7B; font-family:'Proxima_nova_regular'; font-size:14px; display:block;}.menu ul li a:hover{ background:#FFF; margin-top:-3px; padding-bottom:13px; border-bottom:1px solid #FFF;}.menu ul li a img{ margin-left:2px;}.menu ul li:hover ul.submenu{ display:block;}/* SUBMENU */.menu ul li ul.submenu{ display:none; width:300px; position:absolute; margin-top:38px; background:#FFF; padding-top:5px; border:1px solid #C9D3DD; border-top:1px solid #FFF;} OBS: Preciso em css, sem javascript.. Oq precisa mudar acima? UP!!! Compartilhar este post Link para o post Compartilhar em outros sites
Diogo Rodrigues_79134 4 Denunciar post Postado Abril 22, 2013 Olá! Para você conseguir esse efeito, será preciso aplicar os estilos do hover no seletor "li": .menu ul li a:hover{ background:#FFF; margin-top:-3px; padding-bottom:13px; border-bottom:1px solid #FFF; } para .menu ul li:hover { background:#FFF; margin-top:-3px; padding-bottom:13px; border-bottom:1px solid #FFF; } Deste modo, enquanto o ponteiro do mouse estive encima do submenu, o li estará em seu estado hover. ;D Compartilhar este post Link para o post Compartilhar em outros sites
Andrew Marques 47 Denunciar post Postado Abril 22, 2013 Obrigado mano, deu certo!! Vlw mesmo Compartilhar este post Link para o post Compartilhar em outros sites