Ir para conteúdo

Arquivado

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

Deives

Menu em CSS

Por , em Desenvolvimento frontend

Recommended Posts

Deives    0

Deives
Postado

Olá pessoal! estou criando um site mais estou com um problema, ai vai: estou utilizando um menu com CSS bem simples, no IE 6.0 ele funciona normal, mais no Netscape e outros navegadores o estilo CSS não pega em toda a célula, só no link, veja abaixo o menu pronto:

 

http://www.mundodanet.xpg.com.br/menu_css3.htm

 

Queria saber se tem algum código que eu possa acrescentar p/ que ele funcione em outros navegadores como funciona no IE 6.0. Veja abaixo como fica no Netscape 7.2:

 

http://img80.imageshack.us/img80/11/menucss3wo5.jpg

 

Código completo da pagina:

 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html><head><title>Menu CSS</title><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"><STYLE type="text/css" media="screen,projection">body {		margin-left: 0px;		margin-top: 0px;		margin-right: 0px;		margin-bottom: 0px;		background-color: #FFFFFF;}body,td,th {		font-family: Verdana, Arial, Helvetica, sans-serif;		font-size: 10px;		color: #000000;}form {		margin-bottom	: 0px;		padding		  : 0px;}</STYLE><style type="text/css">#menu { /* Aqui definimos o o estado do menu normal */width:150px; /* Aqui definimos o tamanho na horizontal */height:20; /* Aqui definimos o tamanho na vertical */padding-left: 6px; /* Aqui definimos o espaço entre o texto e a borda esquerda */padding-top: 4px; /* Aqui definimos o espaço entre o texto e a borda esquerda */font-family: Verdana, Arial, Helvetica, sans-serif; /* Aqui definimos a fonte*/font-size: 10px; /* Aqui definimos o tamanho da fonte*/color: #003366; /* Aqui definimos a cor da fonte*/background-color: #E9E9E9; /* Aqui definimos o fundo*/border: none; /* Aqui definimos a borda*/text-decoration: none; /* Aqui definimos a decoração do texto*/}#menu:hover { /* Aqui definimos o o estado do menu quando o mouse é passado por cima */width:150px; /* Aqui definimos o tamanho na horizontal */height:20; /* Aqui definimos o tamanho na vertical */padding-left: 6px; /* Aqui definimos o espaço entre o texto e a borda esquerda */padding-top: 4px; /* Aqui definimos o espaço entre o texto e a borda esquerda */font-family: Verdana, Arial, Helvetica, sans-serif; /* Aqui definimos a fonte*/font-size: 10px; /* Aqui definimos o tamanho da fonte*/color: #000000; /* Aqui definimos a cor da fonte*/background-color: #F0F0F0; /* Aqui definimos o fundo, no caso uma cor mais escura*/border: none; /* Aqui definimos a borda*/text-decoration: none; /* Aqui definimos a decoração do texto, no caso está sublinhado*/}</style></head><body><table width="150" border="0" cellpadding="0" cellspacing="0">  <!--DWLayoutTable-->  <tr> 	<td width="150" height="20" valign="middle"><a id="menu" href="http://mundodanet.50webs.com/web/principal.htm" target="principal">» 	  Link 01</a></td>  </tr>  <tr> 	<td height="1"></td>  </tr>  <tr> 	<td height="20" valign="middle"><a id="menu" href="http://mundodanet.50webs.com/web/principal.htm" target="principal">» 	  Link 02</a></td>  </tr>  <tr> 	<td height="1"></td>  </tr>  <tr> 	<td height="20" valign="middle"><a id="menu" href="http://mundodanet.50webs.com/web/principal.htm" target="principal">» 	  Link 03</a></td>  </tr>  <tr> 	<td height="1"></td>  </tr>  <tr> 	<td height="20" valign="middle"><a id="menu" href="http://mundodanet.50webs.com/web/principal.htm" target="principal">» 	  Link 04</a></td>  </tr>  <tr> 	<td height="1"></td>  </tr>  <tr> 	<td height="20" valign="middle"><a id="menu" href="http://mundodanet.50webs.com/web/principal.htm" target="principal">» 	  Link 05</a></td>  </tr>  <tr> 	<td height="6"></td>  </tr></table></body></html>

Obrigado pela atenção... http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

Compartilhar este post

Link para o post
Compartilhar em outros sites

Deives    0

Deives
Postado

Eai gio, valeu pela dica, apesar de não saber muita coisa na área até to conseguindo mexer... rs

 

coloquei no estilo:

 

display: block;
E resolveu o problema, porém olhando no Netscape a célula que tem 150px x 20px aparece um pouco maior e isso é suficiente p/ que de problema nas tabelas... rs ... dei uma olhada lá no site maujor + ñ encontrei nd a respeito desse problema...

 

Os exemplos:

 

http://www.mundodanet.xpg.com.br/menu_css3.htm

 

no Netscape:

 

http://img380.imageshack.us/img380/4615/menucss32nn0.jpg

 

Valeu...

Compartilhar este post

Link para o post
Compartilhar em outros sites

Giovani    104

Giovani
Postado

Eu, pessoalmente, aconselho a ler os links que passei e esquecer esse negócio de tabelas.

Se você for no maujor.com vai ver que é bem simples fazer um menu como você quer!!!

 

Mesmo assim, parabéns por encontar uma solução!!! http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

 

[]´s

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