• Revista PROGRAMAR: Já está disponível a edição #53 da revista programar. Faz já o download aqui!

maiden

[Resolvido] Tamanho do elemento a

5 mensagens neste tópico

Boas,

Tenho uma barra de menu horizontal, na qual utilizo como background uma imagem de 5x33, repetida no eixo do x (repeat-x). Nessa barra tenho uma lista não ordenada (<ul>), com display: inline;, cujos itens são os links para as diferentes páginas do projecto. Depois tenho outra imagem de 5x33 que representa o link no estado hover, repetindo-se também no eixo do x. O problema é que apesar de a imagem ser repetida no eixo do x, esta cobre apenas a área de texto em vez de ocupar os 33px de altura. Fica algo deste género:

2s8sjg1.png

quando o meu objectivo era que a imagem mostrada no hover do link tivesse os 33px, de forma a tocar na barra azul cá de baixo.

Já defini uma altura para o a, mas não resulta. Inclusive já tentei definir a imagem como background do <li> e utilizar a pseudo-class hover para este elemento, mas o resultado é o mesmo.

O código CSS que tenho para esta barra é o seguinte

#topo #nav {
background: #87aade url('img/nav_back.png') repeat-x;
width: 1024px;
height: 37px;
text-transform: lowercase;
font: bold 16px Verdana;
}

#topo #nav ul li {
display: inline;
height: 33px;
}

#topo #nav ul li a {
color: #fff;
height: 33px;
}

#topo #nav ul li a:hover {
background: url('img/nav_high.png') repeat-x;
height: 33px;
}

Alguém me dá uma ajuda?

Cumps,

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Boas Battousai,

Também já tinha tentado isso, mas perdem o inline, ou seja, fica com este aspecto:

2qvgxeb.png

Obrigado pela atenção.

Cumps,

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

No Li em vez de meteres display:inline, poe display:block;float:left

depois é só dar margens ou paddings, como quiseres.

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Crie uma conta ou ligue-se para comentar

Só membros podem comentar

Criar nova conta

Registe para ter uma conta na nossa comunidade. É fácil!


Registar nova conta

Entra

Já tem conta? Inicie sessão aqui.


Entrar Agora