Ir para conteúdo
Fórum Script Brasil
  • 0

problemas com menu

Diogo Freitas

Perguntado por Diogo Freitas,

 Share

Pergunta

Diogo Freitas

Diogo Freitas

Postado
Postado

boas tardes,

estou com umpequeno problema num meu.

Bem o preoblema é que o submen horizontal deveria aparcer espaçado e na verdade não aparece.

Aparecem as letras em cima umas das outras.

O que será?

<style>
 /* menu horizontal-vertical by micox */
 .menu-hv * { margin: 0; padding: 0;}
 .menu-hv a { display: block; }
 .menu-hv li { list-style: none; float: left; height: 1%; }
 .menu-hv li ul { position: absolute; visibility: hidden;}
 .menu-hv li ul li { float: none; white-space: nowrap; display: inline; /* o inline é pro IE */}
 .menu-hv li ul li ul { position: absolute; left: 100%; top: 10; }
 .menu-hv li:hover ul, .menu-hv li.over ul { visibility: visible;}
 .menu-hv li:hover ul ul, .menu-hv li.over ul ul { visibility: hidden;}
 .menu-hv ul ul li:hover ul, .menu-hv ul ul li.over ul { visibility: visible;}
 /* visual */
 .menu-hv {  background: url(../gif/add-bg.gif) repeat-x top;
             width: 700px;
             margin: 0 0 0 12px;
             height: 20px;
             border-top:#1C8FBF 1.5px solid;
             border-bottom:#1C8FBF 1.5px solid;
             padding-top:2px;
             padding-bottom:2px;
             padding-left:10px;
             }
             .menu-hv a { text-decoration: none; color: #666666; padding: 0 10px;}
             .menu-hv a:hover {color: #1C8FBF;}
             .menu-hv ul li ul { border-bottom: 1px solid #1c8fbf; padding-top:3px;}
</style>
<body>
 <div class="menu-hv">
   <ul>
     <li><a href="quem-somos.php">empresa</a></li>
     <li><a  href="produtos.php">produtos</a>
       <ul><a  href="radios-portateis.php">esferográficas</a></ul>
       <ul><a  href="radios-portateis.php">esferográficasvdfvdvdd</a></ul>
       <ul><a href="">cnsdkc</a></ul>
           </li>
         <li><a  href="radios-moveis.php">contacto</a></li>
         <li><a  href="repetidoras.php">Repetidoras</a></li>
         <li><a  href="sistemas-hf.php">Sistemas HF</a></li>
         <li><a  href="acessorios.php">Acessórios</a></li>
       </ul>
 </div>
</body>

Link para o comentário
Compartilhar em outros sites

8 respostass a esta questão

Posts Recomendados

  • 0
_Vinny_

_Vinny_

Postado
Postado

Vamos lá, não sou bom com css e menu, mas vou dar uma forcinha. Faça a seguinte mudança:

De

.menu-hv * { margin: 0; padding: 0;}
Para 
.menu-hv * { margin: 1; padding: 0;}

Isso vai fazer o menu se alinhar perfeitamente. O resto não consegui arrumar. Sorry...

Link para o comentário
Compartilhar em outros sites
  • 0
Willian Antunes

Willian Antunes

Postado
Postado

Iae Diogo Freitas !! ...

Achei o seu problema, era no HTML .. Abaixo segue os códigos para comparação (não liga pros nomes dados aos menus, fiz só um teste :P)

<html>
<head>
<title>Menu</title>
<style type="text/css" media="screen"><!--

*            {
        padding: 0px
        margin: 0px;
}

/* menu horizontal-vertical by micox */
.menu-hv * {
        margin: 0;
        padding: 0;
}
.menu-hv a {
        display: block;
}
.menu-hv li {
        list-style: none;
        float: left;
        height: 1%;
}
.menu-hv li ul { position: absolute; visibility: hidden;}
.menu-hv li ul li { float: none; white-space: nowrap; display: inline; /* o inline é pro IE */}
.menu-hv li ul li ul { position: absolute; left: 100%; top: 10; }
.menu-hv li:hover ul, .menu-hv li.over ul { visibility: visible;}
.menu-hv li:hover ul ul, .menu-hv li.over ul ul { visibility: hidden;}
.menu-hv ul ul li:hover ul, .menu-hv ul ul li.over ul { visibility: visible;}
/* visual */
.menu-hv {  background: url(../gif/add-bg.gif) repeat-x top;
             width: 700px;
             margin: 0 0 0 12px;
             height: 20px;
             border-top:#1C8FBF 1.5px solid;
             border-bottom:#1C8FBF 1.5px solid;
             padding-top:2px;
             padding-bottom:2px;
             padding-left:10px;
             }
             .menu-hv a { text-decoration: none; color: #666666; padding: 0 10px;}
             .menu-hv a:hover {color: #1C8FBF;}
             .menu-hv ul li ul { border-bottom: 1px solid #1c8fbf; padding-top:3px;}
--></style></head>
<body>
<div class="menu-hv">
   <ul>
     <li><a href="quem-somos.php">Gregório</a></li>
     <li><a  href="produtos.php">Dartanhan</a>
       <ul>
        <li><a  href="radios-portateis.php">Pomodoro</a></li>
       <li><a  href="radios-portateis.php">Bartolomeu</a></li>
       <li><a href="">Napoleão</a></li>
           </ul></li>
         <li><a  href="radios-moveis.php">Nicolas Tesla</a></li>
         <li><a  href="repetidoras.php">Thomas Hobes</a></li>
         <li><a  href="sistemas-hf.php">Martin Luther Rei</a></li>
         <li><a  href="acessorios.php">Apetrechos</a></li>
       </ul>
</div>
</body>

Link para o comentário
Compartilhar em outros sites

Participe da discussão

Você pode postar agora e se registrar depois. Se você já tem uma conta, acesse agora para postar com sua conta.

Visitante
Responder esta pergunta...

×   Você colou conteúdo com formatação.   Remover formatação

  Apenas 75 emoticons são permitidos.

×   Seu link foi incorporado automaticamente.   Exibir como um link em vez disso

×   Seu conteúdo anterior foi restaurado.   Limpar Editor

×   Você não pode colar imagens diretamente. Carregar ou inserir imagens do URL.

×
 Share
Ir para lista de Perguntas


  • Estatísticas dos Fóruns

    • Tópicos
      152,3k
    • Posts
      652,3k
×
×
  • Criar Novo...