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

(Resolvido) Problema com link em lista HTML


Anderson Ferreira

Pergunta

Olá galera, boa tarde a todos!

Estou com um probleminha ;X

Fiz uma lista HTML, esta lista vai ser meu menu horizontal. Então, coloquei links em cada item dessa lista, pois o menu tem links, claro ...

Meu HTML ficou assim:

[...]

<ul class="cabecalho_menu">
    <a href="#inicio"><li class="inicio"></li></a>
    <a href="#login"><li class="login"></li></a>
    <a href="#cadastro"><li class="cadastro"></li></a>
    <a href="#cadastro"><li class="outras_cidades"></li></a>
    <a href="#anuncie"><li class="anuncie"></li></a>
    <a href="#sobre"><li class="sobre"></li></a>
</ul>

[...]
E meu CSS:
.cabecalho_menu { padding-top: 25px; }
.cabecalho_menu li { display: inline; float: left; margin-right: 35px; }

.cabecalho_menu .inicio { width: 65px; height: 37px; background: url('../img/cabecalho_menu.png'); }
.cabecalho_menu .login { width: 75px; height: 37px; background: url('../img/cabecalho_menu.png') -65px 0; }
.cabecalho_menu .cadastro { width: 105px; height: 37px; background: url('../img/cabecalho_menu.png') -140px 0; }
.cabecalho_menu .outras_cidades { width: 155px; height: 37px; background: url('../img/cabecalho_menu.png') -245px 0; }
.cabecalho_menu .anuncie { width: 90px; height: 37px; background: url('../img/cabecalho_menu.png') -400px 0; }
.cabecalho_menu .sobre { width: 66px; height: 37px; background: url('../img/cabecalho_menu.png') -490px 0; }

Usei uma única imagem pra ser o menu, e utilizei o background-position pra posicionar cada background de cada item da lista

Então abri minha página no Internet Explorer e funcionou normalmente... Um menu com 6 itens, e cada item com um link.

Depois abri minha página no Google Chrome, e também funcionou normalmente.

Mas na hora que abri no Firefox, os links do menu não funcionou =X // Ou seja, os itens apareceram normalmente, um do lado do outro, idêntico aos outros navegadores, o problema é q os links não funcionaram :S // O que será q esta acontecendo?

MUITO Obrigado,

Anderson Ferreira

Editado por Anderson Ferreira
Link para o comentário
Compartilhar em outros sites

5 respostass a esta questão

Posts Recomendados

  • 0
Primeiro vem a LI depois a tag A, olhe o exemplo:

<li class="inicio"><a href="#inicio"></a></li>

Use o validador da W3C para verificar a semântica do seu código:

http://validator.w3.org/

[]'s

Tentei assim também, mas dessa maneira é pior ainda, não funciona em nenhum navegador o link :S

Link para o comentário
Compartilhar em outros sites

  • 0

Da maneira q você falou não funcionou :S // E da minha maneira não funciona no Firefox os links

E acho q a única maneira de fazer isso CORRETAMENTE, é com listas =\

-----------------

Mas acho q posso fazer assim: fazer a lista, e colocar DIV dentro da lista, e colocar pra que as imagens dos itens do menu seja impressa pela DIV,e não pela lista

Vou tentar e posto o resultado aq :D

Link para o comentário
Compartilhar em outros sites

  • 0

RESOLVIDO =D

Fiz o nome com DIV`s e funcionou

<div class="cabecalho_menu">
    <a href="#inicio"><div class="inicio"></div></a>
    <a href="#login"><div class="login"></div></a>
    <a href="#cadastro"><div class="cadastro"></div></a>
    <a href="#outras_cidades"><div class="outras_cidades"></div></a>
    <a href="#anuncie"><div class="anuncie"></div></a>
    <a href="#sobre"><div class="sobre"></div></a>
</div>

Obrigado,

Anderson Ferreira

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.



  • Estatísticas dos Fóruns

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