Ir para conteúdo

POWERED BY:

Arquivado

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

sr.silva

Perfeito no Firefox e Opera. Mas no IE.

Recommended Posts

Pessoal,

 

Esse layout está funcionando perfeitamente no FF e Opera. Mais não sei o que acontece que quando visualizo no

IE, fica todo deformado.

 

Tem com ajudarem?

 

html

<div id="geral"><br />

	<div id="fundo-branco">		
	 
	  <!-- #div logo  -->
		<div id="logo"> </div>
		
 
		<!-- #div paginas site -->
		<div id="fundo-paginas">

			  <!-- #div conteudo paginas -->		
			<div id="conteudo-paginas">			
				<p> nononononononononon</p>			   
			  </div>
			
		</div>


	  <!-- #div menu horizontal  -->
		<div id="menu"><img src="images/menu.jpg" width="404" height="32" /></div>
	
	
	  <!-- #div imagens site -->
	  <div id="fundo-imagens">		
			<div id="imagens"></div>
	  </div>
		
		
	</div>
	
</div>

css

/* CSS Document */
 
#geral{
	width:800px;
	height:600px;
	background-image:url("../images/fundo.jpg");	
	background-repeat: no-repeat;
}

#fundo-branco{
	margin-top:74px;
	margin-left:30px;
	margin-right:30px;
	margin-bottom:61px;
	width:730px;
	height:465px;
}

#fundo-paginas{
	width:381px;
	height:465px;
	background-image:url("../images/fundo-paginas.jpg");
	float:left;
}

#fundo-paginas #conteudo-paginas{
/*	background-image:url("../images/menu.jpg");
	background-repeat: no-repeat;*/
	width:330px;
	height:208px;
	margin-left:40px;
	margin-bottom:5px;
	margin-top:50px;
	
	font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif !important;
	font-size:11px !important;
}
 
#fundo-imagens{
	background-image:url("../images/fundo-imagens.jpg");
	width:349px;
	height:489px;
	float:left;
}

#fundo-imagens #imagens{
	background-image:url("../images/fotos/imagem-fundo.jpg");
	width:487;
	height:439px;
}


#menu{
	position:absolute;
	width: 349px;
	left: 353px;
	top: 85px;
	height: 30px;
	background-image:url("../images/menu.jpg");	
}

#logo{
	position:absolute;
	width: 349px;
	left: 27px;
	top: 47px;
	height: 54px;
	background-image:url("../images/topo-logo.jpg");	
}

 

Agradeço desde já. http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

Compartilhar este post


Link para o post
Compartilhar em outros sites

sr.silva, Bom Dia!

Acredito que postando um link para visualizar fica melhor para o pessoal analisar o problema e sugerir uma solução...

Se possivel posta um link também... ;)

 

Até Mais.

Compartilhar este post


Link para o post
Compartilhar em outros sites

Na verdade, os UNICOS navegadores que renderizaram certinho o teu layout(sem quebras de posicionamento), aqui pra mim, foi o IE7 e o Opera, tanto o Safari como o FF estão apresentando problemas com as imagens do topo..

 

No IE6, foi um completo caos... dá uma verificadinha no código todo, vou dar uma mechida aqui tb, já já eu posto algo.

 

(já que está usando a hospedagem gratuita do Yahoo), tente burlar as propagandas dele, em alguns casos, há propagandas tão invasivas que elas é que acabam detonando o lay...

ou procure outra hospedagem.

Compartilhar este post


Link para o post
Compartilhar em outros sites

opa tiu!!

 

na verdade estou usado o yahoo! apenas pra mostrar aqui no fórum.

 

quanto a sua avalição dos browser os únicos que tenho são:

 

-Firefox

-Opera

-IE6

 

Engraçado que no Firefox pra mim ficou correto. Somente no IE que bagunçou tudo.

 

Até!

Compartilhar este post


Link para o post
Compartilhar em outros sites

Olá,

 

Aqui no meu firefox não ficou bem não. Experimente limpar seu cache do navegador e veja os resultados.

Se tiver tempo ainda tento analisar seu código.

 

Cumps \o/

Compartilhar este post


Link para o post
Compartilhar em outros sites

Eu fiquei muito confuso lendo esse código...

Muitas divs ai podem ser eliminadas sem a menor perca de conteudos, e garantindo resultados ....

 

Por exemplo, porque você fez uma div para por o fundo da próxima? e porque recortou tanto o lay?

Trabalhando com DIVs, corretamente, posicionando certinho, isso não é necessário... está parecendo uma tabela oO

 

<div id="fundo-paginas">
 <!-- #div conteudo paginas -->		
 <div id="conteudo-paginas"> 
......

Fiquei aqui trabalhando no sey layout, e eis que me surge à duvida...

A área do site, será somente essa? ou as páginas "esticarão" para baixo, fazendo ter scroll vertical?

Compartilhar este post


Link para o post
Compartilhar em outros sites

ops!! sorry.. :wacko:

 

http://geocities.yahoo.com.br/bsilvaweb

 

pronto!! ;)

 

sr.silva sabe que estamos todos aqui pra aprender né!! não se ofenda mas o teu codigo tem que ser refeito está com muitas propriedades desnecessárias no CSS e tem elementos XHTML perdidos no meio do seu code com certeza é isso que esta estragando seu layout !!!

 

repito estamos todo aqui pra aprender-mos um com os outros não se ofenda se as veses aparecer um comentario mais SAIDINHO diremos assim!

 

http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

Compartilhar este post


Link para o post
Compartilhar em outros sites

Bem sr.Silva com os seus constantes tóp percebi que você ainda está muito VERDE com o xHTML e CSS

seria necessario você estudar mais um pouco, pois percebo assim como o Ronaldo Bitencourt disse tem muita coisa desnecessaria.

 

estude um pouco mais de uma lida aqui nas tutoriais e no laboratorio assim garanto que você vai melhorar

mas você está se esforçando bastante

 

isso é só um toque por que ao fazer as coisas você esta deixando de aprender algumas coisas da maneira certa.

 

é só um toque ta ok??

 

 

abraço ;)

Compartilhar este post


Link para o post
Compartilhar em outros sites

Uma só imagem já não era suficiente para resolver o teu layout, e mais outra para o menu?

 

http://www.cenasordidas.hbe.com.br/exemplos/bsilvaweb.html

Observe que usei 1/3 de linhas doque tinha teu código original

 

(desculpa a qualidade das imagens, é que fui juntando os fragmentos...)

 

Seria algo assim que você pretendia fazer? Faça o simples! Vi que no teu código, você se preocupou muito em posicionar diversas DIVs, desnecessariamente.

Dê uma reestudada em CSS. Se você precisar que o conteúdo "estique" para baixo, gerando scroll, é só dividir o rodapé.

E deixar a àrea de conteudo livre.

Compartilhar este post


Link para o post
Compartilhar em outros sites

Pessoal!

 

Como faço pra poder entender CSS como vocês. Dar dicas, visualizar melhores "práticas" de criação e etc.. :huh:

 

Aqui como sempre, só respondem os experts!

 

O "tiu" ae deu uma resposta enxuta e sem complicação. Queria eu fazer código assim... :s !!! Respondendo sua dúvida, a área do site será somente essa mesmo!

 

O meu problema e adaptar os artigos que leio e etc..as minhas necessidades.

 

Bem, talvez eu pare de postar tanto como ultimamente. Mais aviso! eu voltarei!!! ;)

 

Por favor, não pensei que estou aqui pra roubar códigos prontos de vocês..por favor isso não. Mais se souberem a dificuldade que tenho

pra aprender "tableless", você não fazem idéia. Afinal sou um mero programador que tenta aventurar-se em estruturação de sites.. :P

 

Mais uma vez agradeço as respostas. Todas podem ter certeza, irão fazer efeito..tentarei estudar mais pra conseguir entender..."hã aqui funciona no IE, aqui não" e etc...

 

Ficarei um tempo em off, acho que já estorei minha cota de dúvidas aqui...nesses tempos.. ^_^

 

Digo uma coisa..hein!! Eu voltarei.

 

[]´s

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.