Postagens
Não informado
Posted by Estou aprendendo tableless já, mais isso é realmente muito urgente, e perdi 1 dia inteiro já tentando resolver, pesquisando, e nada resolveu, por isso vim ate aqui pedir a ajuda de vcs, um amigo recomendou, dizendo que tinha gente muito capacitada.
É meu ultimo site usando tabelas, infelizmente o menu desse é um pouco diferente dos em flash que normalmente eu trabalho.
A ideia é ele ser apenas uma barra, e com mouseOn ele aparecer um botao, com as bordas redondas em cima assim:
Rapidamente eu consegui a seguinte apresentação:
Ou seja, o menu esta alinhado a esquerda, e com um espaço inexistente em cima, entre o banner superior, e uma linha branca de 1px em baixo, entre ele e o conteúdo.
Segue abaixo meu codigo CSS e HTML:
@charset "utf-8";/* CSS Document */body { margin-bottom:0px; margin-left:0px; margin-right:0px; margin-top:0px;}.texto_faixa_topo_esquerda { text-align:left; padding-left:6px; font-family:Tahoma, Geneva, sans-serif; color:#FFF; font-size:11px; font-weight:bold;}.texto_faixa_topo_direita { text-align:right; padding-right:6px; font-family:Tahoma, Geneva, sans-serif; color:#FFF; font-size:11px; font-weight:bold;}.topo1 { background-image:url(images/topo1.jpg) ; background-position: center center; background-repeat:no-repeat;}#menu li {background: url(images/centro.jpg) repeat-x;list-style:none;float: left;font-size: 12px;font-family:Tahoma, Geneva, sans-serif;font-weight: bold;margin: 0px 0px 0px 0px;white-space: nowrap;}#menu ul li { display: inline; }#menu a:link, #menu a:visited, #menu a:active {background: transparent url(images/esquerda.jpg) no-repeat scroll left top;color:#FFF;display: block;float:center;text-align: center;text-decoration: none;}#menu a span {background: transparent url(images/direita.jpg) no-repeat scroll right top;display: block;line-height: 53px;padding: 0px 23px 0 23px;}#menu .active {background-color: #FFFFFF;}#menu .active, #menu .active a:link, #menu .active a:visited, #menu a:hover, #menu li:hover {background-position: 0 -54px;}#menu .active span, #menu a span:hover {background-position: 100% -54px;} .tabela_conteudo { background:url(images/bg_interno.jpg); background-repeat:repeat-y; background-position:center top; padding-left:13px; padding-right:13px; padding-top:15px; padding-bottom:5px; font-family:Tahoma, Geneva, sans-serif; font-size:11px; color:#FFF; text-decoration:none; }<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>Documento sem título</title><link href="css.css" rel="stylesheet" type="text/css" /></head><body><table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr> <td><table width="100%" border="0" align="center" cellpadding="0" cellspacing="0"> <tr> <td height="23" background="images/topo_faixa_bg.jpg"><table width="770" border="0" align="center" cellpadding="0" cellspacing="0"> <tr> <td width="385" class="texto_faixa_topo_esquerda">sssss</td> <td width="385" class="texto_faixa_topo_direita">sss</td> </tr> </table></td> </tr> <tr> <td height="186" align="center" class="topo1"> </td> </tr> </table></td> </tr> <tr> <td height="53" align="center" valign="top"><div align="center top"><ul id="menu"> <li><a href="#" title=""><span>Home</span></a></li> <li><a href="#" title=""><span>Testepalavragrande</span></a></li> <li><a href="#" title=""><span>oi</span></a></li> <li><a href="#" title=""><span>Testezao</span></a></li> <li><a href="#" title=""><span>Contato</span></a></li> </ul> </div> </td> </tr> <tr> <td><table width="770" border="0" align="center" cellpadding="0" cellspacing="0"> <tr> <td valign="top" class="tabela_conteudo">dsadsaadsdsadsadasd</td> </tr> <tr> <td align="center" valign="top"><img src="images/rodape.gif" width="770" height="18" /></td> </tr> </table></td> </tr></table><blockquote> </blockquote></body></html>
Estou a mais de 13 horas sentado tentando resolver, jah passei por muitos possiveis problemas, alguem por favor pode me ajudar?
Muito obrigado desde já
- Miguceamma likes this
