torto no IE6 e no FF.

lucasmartins · Setembro 27, 2007

Galerá estou com problemas,

link da vitima http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif : http://www.guiajabaquara.com.br/

no firefox: Meu layout está esticando as divs dos menus e jogando a div do conteúdo pra baixo, o que não acontece com o IE7 (pelo menos na resolução 1024x768).

no IE6 (pelo menos na resolucao 1280x768): fica tudo torto, tudo fora do lugar... estranho... me ajudem...

ai vai os códigos CSS e do LAYOUT:

CSS >>

html, body { height : 100%;}html {font-size: 100%;} body { margin : 0;padding : 0;font : 70% tahoma, helvetica, "Trebuchet MS", arial, verdana, sans-serif;background : #fff url(images/bgd01.jpg) top center repeat-y;color : #666;} #wrap {margin : 0 auto;padding : 0;width: 800px;}#top{ margin : 0;padding : 0;background : #000000;} #top a { color : #FFF;text-decoration : none;} #top a:hover { text-decoration : none;color : #abccff;}#top h2 { margin : 0;padding : 8px 0;text-align : center;letter-spacing : 5px;font-size : 90%;background : transparent;color : #aaa;} .header { margin-bottom: 20px;height : 100px;width : 100%;background : transparent url(images/head.jpg) top center no-repeat;padding-top : 0;} .banner {float : left;margin-left : 35%;margin-top : 3%;margin-bottom : 20px;line-height : 2em;background : transparent;width:468px;height:60px;}} .sidebar { margin-left : 1%;float : left;width : 20%;height : 100%;margin-top : 0px;padding-top : 0;line-height : 2em;background : transparent;} .col1 { float : left;width : 50%;margin-left : 2%;margin-right : 1%;margin-top : 0;margin-bottom : 20px;line-height : 2em;background : transparent;} .col2 {float : left;width : 22%;margin-left : 2%;margin-top : 0;margin-bottom : 20px;line-height : 2em;background : transparent;} .footer { float : left;width : 100%;padding : 5px 0;text-align : center;font-size : 90%;background : #fff;color : #333;} .sidenav { margin : 10px 10px;padding : 0;list-style-type : none;background : inherit;color : #fff;} .sidenav a { letter-spacing : 2px;border-bottom : 1px solid #aaa;margin-bottom : 5px;padding-left : 20px;display : block;text-decoration : none;background : url(images/arrow.gif) no-repeat left center;color : #003185;} .sidenav a#current, .sidenav a:hover { text-decoration : none;background : url(images/db_red.gif) no-repeat left center;color : #B10000;} ul { list-style : none;margin : 0;padding : 0;} .imgleft { float : left;margin : 10px;} .imgright { float : right;margin : 10px;}a { color : #B40000;text-decoration : none;} a:hover { text-decoration : underline;color : #000;} p { padding : 0 10px;} h1 { padding : 10px;letter-spacing : 2px;font-size : 130%;color : #6B88A6;} h2 { padding : 10px;margin-top : 0;letter-spacing : 3px;font-size : 120%;color : #B40000;} blockquote { letter-spacing: 1px;font-weight : bold;font-style : italic;color : #2A4C6F;} .box {   background: #F7F7F7; }.boxtop {   background: url(images/ne.gif) no-repeat top right; }.boxtop div {   height: 20px;   background: url(images/nw.gif) no-repeat top left; }.boxbottom {   background: url(images/se.gif) no-repeat bottom right; }.boxbottom div {   height: 20px;   background: url(images/sw.gif) no-repeat bottom left; }.boxcontent {  padding: 0px 0px 0px 5px;}				/* SEARCH BOX*/legend {font-weight : bold;color : #000;}input {background: #ececec;color:#000033;border:solid;border-width:thin;size: 10px;font-size:10px;}.botao input{background: #F7F7F7;border:solid;border-color:#333;color: #000000;border-width:thin;size: 10px;font-size:10px;}.hideInput input {border: none;background: none;color: #000000;}.formCadastro {float: left;margin-left: 10%;width: 60%;}.formLogin {float: left;margin-left: 10%;width: 80%;}.botaoBuscar{border:none;background:none;color: none;}

LAYOUT >>

<!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><title>GuiaJabaquara - O único guia do bairro Jabaquara.</title><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /><link rel="stylesheet" type="text/css" href="style.css" /></head><body><!-- TABLELESS --><!-- TOPO DO SITE, MENU HORIZONTAL --><div><div id="wrap"><div id="top">  <h2><a href="index.php">home</a> | <a href="empresa.php">empresa</a> | <a href="contato.php">contato</a></h2></div><div class="header"><div class="banner"><?php echo $phpAds_raw['html'];?>    <img src="banners/anuncie01.gif" width="468" height="60" longdesc="anuncie.php" /></div></div><div class="sidebar"><!-- FIM... TOPO DO SITE, MENU HORIZONTAL --><!-- MENU PRINCIPAL --><!-- MENU PRINCIPAL - GUIACOMERCIAL --><h1>Navegação</h1><div class='box'> <div class='boxtop'><div></div></div>  <div class='boxcontent'>			<ul class="sidenav">			<?php do { ?>			  <li><a href="empresas.php?menu_id=<?php echo $row_rsMenuCategoria['menu_id']; ?>"><?php echo $row_rsMenuCategoria['menu_nome']; ?></a></li>			  <?php } while ($row_rsMenuCategoria = mysql_fetch_assoc($rsMenuCategoria)); ?></ul>	  </div> <div class='boxbottom'><div></div></div></div><!-- FIM.... MENU PRINCIPAL - GUIACOMERCIAL --><br />	<!-- MENU PRINCIPAL - CORPORATIVO -->	<h1>Corporativo</h1><div class='box'> <div class='boxtop'><div></div></div>  <div class='boxcontent'>    		<ul class="sidenav">			<li><a href="index.php" class="menulink">Home</a></li>			<li><a href="empresa.php" title="Sobre o Guia Jabaquara" class="menulink">A Empresa</a></li>			<li><a href="anuncie.php" class="menulink" title="Saiba porque anunciar no Guia Jabaquara">Anuncie</a></li>			<li><a href="contato.php" class="menulink">Contato</a></li>					</ul> </div> <div class='boxbottom'><div></div></div></div><!-- FIM.... MENU PRINCIPAL - CORPORATIVO --><!-- FIM.... MENU PRINCIPAL --><!-- BUSCA -->		<form action="busca.php" method="POST">				<fieldset>					<legend> Busca GuiaJabaquara </legend>				<div>					<span>					<label for="busca"> busca: </label></span>					<span><input name="busca" id="busca" size="15" title="Buscar por Empresa" />				  </span>					<input type="image" name="enviar" id="enviar" value="" class="botaoBuscar" src="images/search.gif"/>				</div>									</fieldset>			</form><!-- FIM....BUSCA --> </div> <!-- CONTEUDO --> <div class="col1">  <h1>Novidades</h1><p>Bem-vindos ao GuiaJabaquara. </p><p>Estamos abrindo espaços para sua empresa, anuncie sua empresa conosco. </p><p>A Internet é a mais nova e mais rápida ferramenta de propaganda, marketing e vendas de produtos e serviços. A Internet cresce a cada dia mais como um meio de comunicação, com novas tecnologias de intereção e acessibilidade entre o cliente e a empresa. Se a sua empresa ainda não está neste meio de comunicação, certamente está disperdiçando um grande veículo de ótimas publicidades.</p></div><!-- FIM...CONTEUDO --><!-- PUBLICIDADES --><div class="col2"><h1>Publicidade</h1><p align="center"><?php echo $phpAds_raw2['html']; ?><img src="banners/anuncie02.jpg" width="120" height="240" longdesc="anuncie.php" /></p><div class='box'> <div class='boxtop'><div></div></div>  <!-- NOTICIAS (GOOGLE ADSENSE) -->    <div class='boxcontent'>  <p><strong>Destaques:</strong></p><?php do { ?>     <a href="emp_desc.php?emp_id=<?php echo $row_rsEmpresas['emp_id']; ?>"><?php echo $row_rsEmpresas['emp_nome']; ?></a><br />  <?php } while ($row_rsEmpresas = mysql_fetch_assoc($rsEmpresas)); ?></div><!-- FIM...NOTICIAS (GOOGLE ADSENSE) --><!-- FIM...PUBLICIDADES --> <div class='boxbottom'><div></div></div></div></div><!-- RODAPE --><div class="footer"><a href="http://www.guiajabaquara.com.br/">home</a> | <a href="mailto:contato@guiajabaquara.com.br">contato</a> | <a href="http://validator.w3.org/check?uri=referer">html</a> | <a href="http://jigsaw.w3.org/css-validator">css</a> |  © 2007 Guia Jabaquara | Produzido por <a href="http://www.lucasmartins.com.br/">Lucas Martins</a><br/></div><!-- FIM...RODAPE --></div><!-- FIM DO TABLELESS =] POR LUCAS MARTINS --></div></body></html>

xm2000 · Setembro 27, 2007

Cara, pela minha experiência em deixar o CSS compatível com o IE e o FF percebi o seguinte, no IE o q você colocar fica lindo, com o mínimo de atributos no CSS, já no FF você tem q atribuir mais exatamente o q você deseja, e o grande vilão nessa minha história é a falta do FLOAT, no FF isso costuma dar problema, as DIVs simplesmente não pegam os atributos de tamanho e posicionamento se o FLOAT não estiver citado, experimente colocar isso no seu CSS.Um abraço!!!

Giovani · Setembro 27, 2007

Existem vários problemas com o IE. E só colocar float não resolve muita coisa.

...no FF isso costuma dar problema, as DIVs simplesmente não pegam os atributos de tamanho e posicionamento se o FLOAT não estiver citado, experimente colocar isso no seu CSS.

Lucas, no link a seguir tem um material explicando como fazer um layout de duas colunas.http://forum.imasters.com.br/index.php?showforum=180

Ernane Ramos · Setembro 27, 2007

Lucas...tente colocar isto

position:relative;

em todos codigos do css...ae dps me fale se deu Certo...

Giovani · Setembro 27, 2007

Já adianto que não é ncessário fazer isso, o link que passei explica como montar o layout corretamente.

lucasmartins · Setembro 28, 2007

Lucas...tente colocar isto
position:relative;
em todos codigos do css...ae dps me fale se deu Certo...

ixi velho pelo que vi, pelo menos no FF não adiantou...não sei no IE6 se adiantou...se alguem poder testar: http://www.guiajabaquara.com.br/pagiteste.phpVlw.

Já adianto que não é ncessário fazer isso, o link que passei explica como montar o layout corretamente.

vlw, vou tentar, qualquer coisa respondo.até agora vlw pessoal...abraços..

lucasmartins · Setembro 28, 2007

Lucas...tente colocar isto
position:relative;
em todos codigos do css...ae dps me fale se deu Certo...

Ernane, tenho uma pequena dúvida...

A propriedade clear pode ser adicionada na div "topo" ???

... vou começar a analizar e arrumar meu css.

Muito obrigado...

lucasmartins · Outubro 1, 2007

RESOLVIDO O DO FIREFOX. AINDA NÃO SEI SE PELO IE6 ESTÁ FICANDO TORTO.VLW gio!!!!abraços,Lucas Martins.

webflex · Outubro 1, 2007

Olá,Amigo aqui no meu FF continua na mesma :S, o conteudo fica todo cá em baixo entao no IE6 fica todo puxado do lado esquerdo..Cumps \o/

Arquivado

torto no IE6 e no FF.

Recommended Posts

lucasmartins 6

Compartilhar este post

Link para o post

Compartilhar em outros sites

xm2000 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Giovani 104

Compartilhar este post

Link para o post

Compartilhar em outros sites

Ernane Ramos 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Giovani 104

Compartilhar este post

Link para o post

Compartilhar em outros sites

lucasmartins 6

Compartilhar este post

Link para o post

Compartilhar em outros sites

lucasmartins 6

Compartilhar este post

Link para o post

Compartilhar em outros sites

lucasmartins 6

Compartilhar este post

Link para o post

Compartilhar em outros sites

webflex 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

select com varias categorias por horario

comando like (Mysql) no php

Alguém com pratica em subir site em codeigniter4 na Hostinger? Não consigo acessar o bd. Erro de Autenticação. O mesmo site funciona normal em outro servidor web.

Fóruns

Tempo Real

Informação importante