Ir para conteúdo

POWERED BY:

Arquivado

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

::..Hunter..::

Bug de posicionamento de divs no IE

Por , em Desenvolvimento frontend

Recommended Posts

::..Hunter..::    1

::..Hunter..::
Postado

Página de exemplo: www.felipesander.com/teste/index.htm

Arquivo CSS: www.felipesander.com/teste/estilo.css

 

No Firefox funciona beleza, mas no IEca ele repete a coluna da direita abaixo da coluna principal, não sei mais como resolver isso.

 

Alguém poderia me explicar pq isso acontece? http://forum.imasters.com.br/public/style_emoticons/default/upset.gif

Compartilhar este post

Link para o post
Compartilhar em outros sites

pa_bruno    0

pa_bruno
Postado

pensei q pudesse ser algo no envio via ftp... mas como eh soh no ie, entaum naum faço idéia... caso ache alguma coisa, falo com você... flwww

Compartilhar este post

Link para o post
Compartilhar em outros sites

Hunter_    0

Hunter_
Postado

HRUAHRUAHURHAURha meu clone é?? http://forum.imasters.com.br/public/style_emoticons/default/devil.gif como ainda n vi solução pra isso, da um <br />

<div id="direito"> <div class="content"> Coluna da Direita1<br /> Coluna da Direita2<br /> Coluna da Direita3<br /> Coluna da Direita4<br /> Coluna da Direita5<br /> </div><br/><----------------------- AQUI</div>

Compartilhar este post

Link para o post
Compartilhar em outros sites

::..Hunter..::    1

::..Hunter..::
Postado

HRUAHRUAHURHAURha meu clone é?? http://forum.imasters.com.br/public/style_emoticons/default/devil.gif como ainda n vi solução pra isso, da um <br />

 

 

<div id="direito">

<div class="content">

Coluna da Direita1<br />

Coluna da Direita2<br />

Coluna da Direita3<br />

Coluna da Direita4<br />

 

Coluna da Direita5<br />

</div>

<br/><----------------------- AQUI

</div>

Ae xará, fiz o que você disse mas ainda continua com erro, como pode ver pela borda da coluna direita parece que toma a largura total da página.

 

Acho que tem alguma coisa a ver com a regra do rodapé que tem clear: both, conforme este tópico do micox: http://forum.imasters.com.br/index.php?sho...mp;#entry539327

 

Tá complicado mesmo. http://forum.imasters.com.br/public/style_emoticons/default/upset.gif

Compartilhar este post

Link para o post
Compartilhar em outros sites

micox    2

micox
Postado

Uai velho, já resolveu???

 

Eu abri aqui no IE e no FF (resolução de 800x600) e não ví diferenças (exceto pequenas coisas de margin/padding)

Ví também uma borda vermelha que imagino ser do principal.

 

Não ví muitas diferenças não. Veja como apareceu aqui:

Imagem Postada

 

 

//heheh, olha a assinatura mó comédia. Boa assinatura. heheh

Compartilhar este post

Link para o post
Compartilhar em outros sites

::..Hunter..::    1

::..Hunter..::
Postado

ainda não resolvi não, micox.a borda vermelha não é da principal, é da coluna direita, que se repete logo após mostrar, e tá mostrando assim as divs:topomenucoluna esquerda - principal - coluna direita<---- coluna direita repetida em todo o espaço --->rodapeNão sei pq a coluna direita se repete, e ainda por cima com largura total.Pior é que se eu não conseguir arrumar este bug serei obrigado a usar o layout todo com table, eca, mas é o jeito.

Compartilhar este post

Link para o post
Compartilhar em outros sites

::..Hunter..::    1

::..Hunter..::
Postado

arrumei, mas não sei pq o padding está agindo na largura das divs, tipo a coluna da esquerda que quero com 160px tive que botar 150px e padding 5px, o que faz ele ficar do tamanho final com 160px, vai entender pq. http://forum.imasters.com.br/public/style_emoticons/default/ermm.gif

 

estilo.css

/* Estilos da estrutura */*, html, body {	margin:0;	padding:0;	}body {	margin:0;	padding:0;	border:none;	font: 11px/1.5 verdana, Arial, Helvetica, sans-serif;	background:silver;	color:#353535;	text-align:center;	}#tudo {	width:779px;	 	margin:0 auto;	padding:0;	text-align:left;	background: white;	color: #353535;	}#topo {	position:relative;	background: url(topo.jpg) no-repeat 0 0; 	height:113px;	}#rodape {	clear:both;	height:auto;	text-align:center;	border-top:1px solid #999;	font-size:9px;	background:white;	color:#353535;	padding: 5px;	}/* Estilos para template de 3 colunas */#principal {	float:left;	margin-left: 5px;		width:458px;	text-align:left;	padding: 5px 0;	}#esquerdo {	float:left;	width:150px;	background: #f36;	padding: 5px;	}#direito {	width:140px;	float:right;	background: #ff0;	padding: 5px;	}#topnav {	border-top: 1px solid #1A5CB1;	padding: 3px 0;	background: url(navbar-bg.gif) repeat-x top #024AA6;	text-align: left;}	#topnav a {	border-right: 1px solid #1A5CB1;	padding: 6px 12px 5px 12px;	color: white;	font-size: 11px;	font-weight: bold;	text-decoration: none;	text-transform: uppercase;}#topnav a:hover, #topnav a:active {	color: #ffff00;	text-decoration: none;}#topnav li {	padding: 0;	display: inline;	background: none;}#topnav ul, #footer ul {	margin: 0;	padding: 0;}ul#mainlevel li, ul#mainlevel-nav li {	padding: 0;	margin: 0;	background: none;}
index.htm

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"><html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pt-br"><head><title>Teste!</title><!-- meta information for search engines --><meta http-equiv="Content-Type"  content="application/xhtml+xml; charset=iso-8859-1" /><meta name="keywords" content="teste, teste" /><meta name="description" content="teste!" /><meta name="robots" content="ALL" /><meta name="author" content="Felipe Vieira Sander" /><meta name="language" content="pt-br" /><!-- CSS --><link rel="stylesheet" type="text/css" href="estilo.css" /></head><body><div id="tudo"><!-- INICIO: TOPO-LOGO --><div id="topo">Topo</div><!-- FINAL: TOPO-LOGO --><!-- INICIO: TOPO-MENU --><div id="topnav"><ul><li><a href="#" class="mainlevel">Home</a></li><li><a href="#" class="mainlevel">NotÍcias</a></li><li><a href="#" class="mainlevel">Downloads</a></li><li><a href="#" class="mainlevel">A Cidade</a></li><li><a href="#" class="mainlevel">Forum</a></li><li><a href="#" class="mainlevel">Wiki</a></li></ul></div><!-- FINAL: TOPO-MENU --><!-- INICIO: COLUNA ESQUERDA --><div id="esquerdo">Coluna da Esquerda1<br />Coluna da Esquerda2<br />Coluna da Esquerda3<br />Coluna da Esquerda4<br />Coluna da Esquerda5<br /></div><!-- FINAL: COLUNA ESQUERDA --><!-- INICIO: COLUNA PRINCIPAL --><div id="principal">	 <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Morbi eleifend, purus quis laoreet faucibus, ante augue malesuada mi, id rhoncus augue lorem eget elit. Ut sollicitudin sodales purus. Phasellus libero felis, blandit nec, commodo ut, imperdiet ut, nibh. Suspendisse potenti. Donec ullamcorper cursus dolor. Duis vitae ipsum. Maecenas dapibus hendrerit diam. Morbi varius, massa id pretium accumsan, nunc lorem congue libero, ut euismod metus libero id nulla. Duis posuere odio sed velit vulputate venenatis. Suspendisse et dui ac metus auctor fringilla. Curabitur interdum augue a pede.  Curabitur hendrerit erat ut augue. </p>	 <p>Cras gravida. Mauris consequat aliquam leo. Aenean non tortor id metus aliquet consectetuer. Quisque sodales lectus ac orci. Donec eleifend fringilla mi. Vivamus vel massa. Aenean interdum pellentesque sem. Nulla pellentesque felis et tortor. Duis cursus, dui non dictum tincidunt, wisi ipsum mollis wisi, nec ornare velit ipsum eget enim. In sed felis. Phasellus condimentum sodales nulla. Etiam orci leo, rutrum malesuada, congue vel, fringilla vitae, lorem. Pellentesque ligula. </p></div><!-- FINAL: COLUNA PRINCIPAL --><!-- INICIO: COLUNA DIREITA --><div id="direito">	Coluna da Direita1<br />	Coluna da Direita2<br />	Coluna da Direita3<br />	Coluna da Direita4<br />	Coluna da Direita5<br /></div><!-- FINAL: COLUNA DIREITA --><!-- INICIO: RODAPE --><div id="rodape">  Rodapé</div><!-- FINAL: RODAPE --></div></body></html>

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