[Resolvido] Bug no Firefox - Float

[Nuno Amaral 0]

Boas pessoal,

 

Tenho este site: http://www.propertiesforsaleinportugal.com/demo

 

No IE tudo ok.

 

No Firefox acontece que quando clico, por exemplo nos links do menu da direita, a barra direita desce para baixo.

Não acontece sempre, só às vezes.

 

Já coloque este css para ver se resolvia, mas não deu:

div#geral:after{ 		content:".";		display:block;		clear:both;		visibility:hidden;		height:0;		overflow:hidden;}

Aqui tá o CSS do site:

body{	padding:0px;	margin:0px;	background-image:url(imagens/fundo.jpg);	background-repeat:repeat-x;	background-color:#f8f4ef;	}	div#geral{	width:800px;	margin:0 auto;	}	/* Bug Float/Dislpay:Table do Firefox */	div#geral:after{ 		content:".";		display:block;		clear:both;		visibility:hidden;		height:0;		overflow:hidden;}		div#topo{	width:800px;	height:80px;	clear:both;	}			div#menu{	width:800px;	height:30px;	clear:both;	margin-top:5px;	}		div#slides{	width:800px;	height:140px;	clear:both;	margin-top:5px;	}		div#conteudos{	width:800px;	clear:both;	display:table;	border-top:#f1024b 4px solid;	background-color:#FFFFFF;	margin-top:1px;	background-image:url(imagens/fundoConteudos.jpg);	background-repeat:repeat-y;	}			div#centro{	width:620px;	float:left;	background-color:#FFFFFF;	}	div#colunadireita{	width:180px;	float:left;	}			div#pesquisa{	width:180px;	}div#pesquisa1{	width:170px;	height:25px;	background-image:url(imagens/pesquisa.jpg);	background-repeat:no-repeat;	color:#FFFFFF;	font-size:11px;	font-weight:bold;	line-height:20px;	padding-left:10px;	}			div#pesquisa2{	width:180px;	margin-top:5px;	}		form{	padding:0px;	margin:0px;	}	.botaopesquisar{	width:80px;	height:20px;	background-color:#d9c7b3;		border:#afafaf 0px solid;	color:#ffffff;	font-size:10px;	margin-top:4px;	margin-left:5px;	}		.caixaspesquisa{	width:135px;	height:16px;	border:#d9c7b3 1px solid;	font-size:11px;	margin-left:5px;	margin-top:1px;	color:#666666;	}			div#newsletter{	width:180px;	margin-top:15px;	}	div#newsletter1{	width:170px;	height:25px;	color:#FFFFFF;	font-size:11px;	font-weight:bold;	line-height:24px;	padding-left:10px;	background-color:#d6004c;	}				.caixas{	width:125px;	height:14px;	border:#d9c7b3 1px solid;	font-size:10px;	margin-left:5px;	margin-top:4px;	}	.botao{	width:25px;	height:20px;	background-color:#d9c7b3;		border:#afafaf 0px solid;	color:#ffffff;	font-size:10px;	margin-top:4px;	margin-left:5px;	}								.filtros{	width:180px;	margin-top:15px;	}		.filtros1{	width:170px;	height:25px;	color:#FFFFFF;	font-size:11px;	font-weight:bold;	line-height:24px;	padding-left:10px;	background-color:#d6004c;	}			.filtros2{	margin-left:5px;}.filtros2 a{	font-family:Verdana, Arial, Helvetica, sans-serif;	font-size:10px;	line-height:18px;	text-decoration:none;	color:#666666;	font-weight:bold;	}.filtros a:hover{	color:#d6004c;	}										div#palavraschave{	font-size:1px;	visibility:hidden;	}				div#rodape{	width:800px;	height:30px;	clear:both;	border-top:#f1024b 2px solid;	line-height:20px;	color:#ac9688;	margin-top:5px;	}

 

Alguém tem uma solução para isto?

[webflex 0]

Olá,

 

Amigo Nuno Amaral, fui ver seu link e carreguei nos links todos do lado direito e não encontrei nenhuma anomalia.. Minha versão de FF é a mais recente (2.0.0.8).

 

Cumps \o/

[Nuno Amaral 0]

Ainda bem.

 

É porque já resolvi o problema.

 

Descobri que o Firefox tem um Bug quando damos o Display:Table.

 

A solução:

 

Tiramos o display:table e colocamos height a 100%

div#conteudos{	width:800px;	height:100%;	clear:both;}

Depois colocamos isto:

div#conteudos:after{ 	content:".";	display:block;	clear:both;	visibility:hidden;	}

Espero que esta solução ajude o pessoal.

[webflex 0]

Olá,Ainda bem que você conseguiu resolver o problema :D.É esse o espirito :D.Cumps \o/