Ir para conteúdo

POWERED BY:

Arquivado

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

SlyX

[Resolvido]  Incompatibilidade IE/FF

Recommended Posts

bem esta funcionando assim normalmente...

só que no FF, ele perdia o background...

#principal #conteudo {	left: 50%;	margin-left: -383px; 	width: 767px; 	margin: auto; 	background: #fffcf8 url(../gfx/principal_conteudo_bg.gif) repeat-x;}#principal #conteudo #esquerda {	float:left;	width:180px;	padding-right: 8px;	text-align: right;}#principal #conteudo #direita { 	float:left; 	width:560px;	  border-left: 1px solid #CCC;	padding-left: 8px;	text-align: left;}
screenshots:

IE:

Imagem Postada

FF:

Imagem Postada

 

 

ai descobri que para funcionar corretamente no FF, eu precisava por o float: left

 

entao eu coloco, mas ele sai do esquadro (logico pois o centralizamento nao funciona mais)

entao eu tento ajustar com um margin-left, mas nao funciona porque a forma que o FF conta o margin é diferente do IE

notem que no IE, o "conteudo" sai um pouco pela esqeurda e sobra um pouco de espaço branco na esquerda

#principal #conteudo {	float: left;	margin-left: 4px; 	width: 767px; 	background: #fffcf8 url(../gfx/principal_conteudo_bg.gif) repeat-x;}#principal #conteudo #esquerda {	float:left;	width:180px;	padding-right: 8px;	text-align: right;}#principal #conteudo #direita { 	float:left; 	width:560px;	  border-left: 1px solid #CCC;	padding-left: 8px;	text-align: left;}
screenshots:

IE:

Imagem Postada

FF:

Imagem Postada

 

 

 

nao sei mais oq fazer =/

 

segue o código css completo:

 

<style>* {	margin:0; padding:0; list-style:none; text-decoration:none; font-style:normal; vertical-align:top; }html, body{  height:100%;  background-color:#e0d4c1;}a:active, a:link, a:visited { color: #5D5D5D; }a:hover { color: #900000; }#geral { 	width: 776px;	height: auto; 	margin: auto; 	padding: 0; 	font: 12px Tahoma, sans-serif;}#topo { 	width: 776px; 	height: 170px; 	background: red;}#topo #logo {	float: left; 	width: 319px; 	height: 170px; 	background: url(../gfx/topo_logo.gif) no-repeat center center;}#topo #imagem {	float: left; 	width: 457px; 	height: 170px; 	background: green;}#menu { 	height: 25px; 	width: 776px; 	background: url(../gfx/bg_menu.gif) repeat-y center center;}#menu #links {	left: 50%;	margin-left: -350px; 	height: 25px; 	width: 700px; 	margin: auto; 	background: #57544d;}#menu #links ul {margin-left: 5px}#menu #links ul li {display: inline}#menu #links ul li a:link, #menu #links ul li a:active, #menu #links ul li a:visited { 	display: block; 	float: left; 	font: bold 12px/25px 'Arial', Arial, Helvetica, sans-serif; 	color: #fff3e1; 	margin-right: 30px; 	padding: 0 5px;}#menu #links ul li a:hover { 	color:#b6aea1;}#principal {	float: left; 	width: 776px; 	background: #fffcf8 url(../gfx/principal_bg.gif) repeat-y center center;}#principal #topo {	float: left; 	width: 776px; 	height: 22px; 	background: url(../gfx/principal_topo.gif) no-repeat center center;}#principal #conteudo {	float: left;	margin-left: 4px; 	width: 767px; 	background: #fffcf8 url(../gfx/principal_conteudo_bg.gif) repeat-x;}#principal #conteudo #esquerda {	float:left;	width:180px;	padding-right: 8px;	text-align: right;}#principal #conteudo #direita { 	float:left; 	width:560px;	  border-left: 1px solid #CCC;	padding-left: 8px;	text-align: left;}#principal #conteudo p { 	font: 12px/18px Tahoma, sans-serif;}#principal #rodape {	float: left; 	width: 776px; 	height: 22px; 	background: url(../gfx/principal_rodape.gif) no-repeat center center;}#rodape { 	float: left; 	width: 776px;}</style>
vou acabar voltando pros table.. to me acabando com css auhiuehauihe

Compartilhar este post


Link para o post
Compartilhar em outros sites

Olá SlyX evite postar essas linhas todas de códigos e imagens... Você poderia apenas definir o seu problema e passar um link para que o pessoal podesse acompanhar o problema, assim você facilita. Passa um link para gente ver melhor o problema. http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

Compartilhar este post


Link para o post
Compartilhar em outros sites

Olá SlyX evite postar essas linhas todas de códigos e imagens... Você poderia apenas definir o seu problema e passar um link para que o pessoal podesse acompanhar o problema, assim você facilita. Passa um link para gente ver melhor o problema. http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

o site roda direto no meu pc =/

 

anyway, ja arrumei

o problema era o bug do margin duplo no IE =/

encontrei a solucao usando um display inline

 

:D

Compartilhar este post


Link para o post
Compartilhar em outros sites

Que bom SlyX que conseguiu resolver o problema e retornou ao tópico para informar.

Qualquer nova dúvida post, lembre-se sempre das dicas. http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

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