Ir para conteúdo

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

phdsg

Problema no menu CSS

Por , em Desenvolvimento frontend

Recommended Posts

phdsg    0

phdsg
Postado

Pessoal,

 

Montei o menu css que qdo você passa o mouse por cima, teoricamente a celula muda de cor, mas o que acontece na pratica, é que inves da celula mudar de cor, o que muda de cor é so a parte de tras do texto, sobrando espaços que onde deveriam mudar, não mudam

 

como posso resolver isso? e por que isso acontece?

 

eis o meu codigo

<html><head><title>Untitled Document</title><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"><style type="text/css"><!--.TABELA {  font-family: Arial, Helvetica, sans-serif; font-size: 14px; color: #FFFFFF; background-color: #999999; padding-left: 5px}a:link {  font-family: Arial, Helvetica, sans-serif; font-size: 16px; color: #FFFFFF; background-color: #999999}a:hover {  font-family: Arial, Helvetica, sans-serif; font-size: 16px; color: #FFFFFF; background-color: #CCCCCC}--></style></head><body bgcolor="#FFFFFF" text="#000000"><table width="13%" border="0" cellspacing="0" cellpadding="0" class="TABELA">  <tr>	<td><a href="#">LINHA 1</a></td>  </tr>  <tr>	<td><a href="#">LINHA 2</a></td>  </tr>  <tr>	<td><a href="#">LINHA 3</a></td>  </tr>  <tr>	<td><a href="#">LINHA 4</a></td>  </tr>  <tr>	<td><a href="#">LINHA 5</a></td>  </tr></table></body></html>

busquei no forum e o mais proximo que consegui foi o link abaixo, que por sinal. fiz as alterações mas nao consegui o efeito desejado

http://forum.imasters.com.br/index.php?showtopic=177989&hl=

 

valeu

Compartilhar este post

Link para o post
Compartilhar em outros sites

pa_bruno    0

pa_bruno
Postado

pessoal naum está sabendo buscar... eh soh colocar display blockoutra coisa, especifique no titulo do post por favor... nada d termos naum identificados em busca

Compartilhar este post

Link para o post
Compartilhar em outros sites

pa_bruno    0

pa_bruno
Postado

onde está o problema... os links (<a>) são display inline, ou seja, só funcionam em seu conteúdo, por isso que só funciona no texto, pq soh o texto faz parte do link... colocando block, ele fica um bloco, como um <p>, <div>, etc... e o tamanho dele padrão, é ficar 100% do seu pai... e nesse seu caso, o <td> eh o pai, por isso, ele ocupará todo o <td>...entendido?

Compartilhar este post

Link para o post
Compartilhar em outros sites

juan    0

juan
Postado

esse menu em css seria assim: com lista e tal...

:

 

<html><head><title>Untitled Document</title><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"><style type="text/css"><!--ul {	background: #999;	width:13%;		padding:0;	border:1px solid #000;	list-style-type: none;}li {	color: #FFF;	margin:0;	padding:0;	padding-left:3px;	display:block;}li:hover {	background:#CCC;}li>a {	color:#FFF;	display:block;	text-decoration:none;}li>a:hover {	text-decoration:underline;--></style></head><body bgcolor="#FFFFFF" text="#000000"><ul><li><a href="#">LINHA 1</a></li><li><a href="#">LINHA 2</a></li><li><a href="#">LINHA 3</a></li><li><a href="#">LINHA 4</a></li><li><a href="#">LINHA 5</a></li></ul></body></html>

;)

 

Só que o estado de hover das li não funcionou no IE...

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Desenvolvimento frontend
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.

  Aceito