[Resolvido] DIV auto ajustável

[Thyago Brasil 0]

sou novo aqui no forum. como que faço pra fazer upload do arquivo.zip? :unsure:

[Thyago Brasil 0]

Galera,

 

Consegui aqui de outra forma fazer com que aumentasse conforme o conteudo. O que fiz, foi diminuir a quantidade de divs que poderiam estar dando a bagunça toda que vcs viram. Porém, ainda estou com um probleminha. Veja na imagem. Coloquei o fundo da pagina em preto para ficar mais facil a visualização de vcs. Ela esta com uma margem no topo e na parte de baixo da div conteudo, porém não coloquei nenhuma margem. Vou postar também o código HTML e CSS.

 

-> Imagem

 

 

-> HTML

 

<div id="DivPagina">
		<div id="CabecalhoPagina">
			<asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
		</div>
		<div id="FundoPagina">
			<div id="PaginaPrincipal">
				<div class="TopoPaginaPrincipal"></div>
				<div class="ConteudoPaginaPrincipal">
					<p>COLUNA CENTRAL COLUNA CENTRAL COLUNA CENTRAL COLUNA CENTRAL
					COLUNA CENTRAL COLUNA CENTRAL COLUNA CENTRAL COLUNA CENTRAL
					COLUNA CENTRAL COLUNA CENTRAL COLUNA CENTRAL COLUNA CENTRAL
					COLUNA CENTRAL COLUNA CENTRAL COLUNA CENTRAL COLUNA CENTRAL
					COLUNA CENTRAL COLUNA CENTRAL COLUNA CENTRAL COLUNA CENTRAL
					COLUNA CENTRAL COLUNA CENTRAL COLUNA CENTRAL COLUNA CENTRAL
					COLUNA CENTRAL COLUNA CENTRAL COLUNA CENTRAL COLUNA CENTRAL
					COLUNA CENTRAL COLUNA CENTRAL COLUNA CENTRAL COLUNA CENTRAL
					COLUNA CENTRAL COLUNA CENTRAL COLUNA CENTRAL COLUNA CENTRAL
					COLUNA CENTRAL COLUNA CENTRAL COLUNA CENTRAL COLUNA CENTRAL
					COLUNA CENTRAL COLUNA CENTRAL COLUNA CENTRAL COLUNA CENTRAL
					COLUNA CENTRAL COLUNA CENTRAL COLUNA CENTRAL COLUNA CENTRAL
					COLUNA CENTRAL COLUNA CENTRAL COLUNA CENTRAL COLUNA CENTRAL
					COLUNA CENTRAL COLUNA CENTRAL COLUNA CENTRAL COLUNA CENTRAL
					COLUNA CENTRAL COLUNA CENTRAL COLUNA CENTRAL COLUNA CENTRAL
					COLUNA CENTRAL COLUNA CENTRAL COLUNA CENTRAL COLUNA CENTRAL
					COLUNA CENTRAL COLUNA CENTRAL COLUNA CENTRAL COLUNA CENTRAL
					COLUNA CENTRAL COLUNA CENTRAL COLUNA CENTRAL COLUNA CENTRAL
					COLUNA CENTRAL COLUNA CENTRAL COLUNA CENTRAL COLUNA CENTRAL
					COLUNA CENTRAL COLUNA CENTRAL COLUNA CENTRAL COLUNA CENTRAL
					COLUNA CENTRAL COLUNA CENTRAL COLUNA CENTRAL COLUNA CENTRAL
					COLUNA CENTRAL COLUNA CENTRAL COLUNA CENTRAL COLUNA CENTRAL
					COLUNA CENTRAL COLUNA CENTRAL COLUNA CENTRAL COLUNA CENTRAL
					COLUNA CENTRAL COLUNA CENTRAL COLUNA CENTRAL COLUNA CENTRAL
					COLUNA CENTRAL COLUNA CENTRAL COLUNA CENTRAL COLUNA CENTRAL
					COLUNA CENTRAL COLUNA CENTRAL COLUNA CENTRAL COLUNA CENTRAL</p>
				</div>
				<div class="RodapePaginaPrincipal"></div>
			</div>
		</div>
		<div id="Menu">
		   Menu
		</div>
		<div id="RodapePagina"></div>
	</div>

-> CSS

 

body 
		{
			margin: 10px;
			background-image: url('images/texture.jpg');
		}

		#DivPagina{
			width: 943px; 
			min-height: 571px;
			position:absolute;
			left: 50%;
			margin-left:-460px;
		}
		
		#CabecalhoPagina
		{
			background-image:url(images/cabecalho.png);
			width: 943px;
			height: 115px;
		}
		
		#FundoPagina
		{
			background-color: #FFFFFF;
			width: 939px;
			min-height: 437px;
			border-left: solid 2px #ff8a00;
			border-right: solid 2px #ff8a00;
		}
		
		#RodapePagina
		{
			background-image: url(images/rodape.png);
			width: 943px;
			height: 19px;
		}
		
		#Menu
		{
			position: absolute;
			width:200px;
			float: left;
			background-color:#3b2f8a;
			padding-bottom: 5px;
			padding-top: 5px;
			min-height: 75px;
			top: 117px;
			left: 5px;
		}
		
		#PaginaPrincipal
		{
			background:#22232F;
			color:#991;
			text-align:justify;
			width: 735px;
			min-height: 420px;
			margin-right: 10px;
			margin-left: 203px;
		}
		
		.TopoPaginaPrincipal
		{
			background-image: url(images/pagina_04.png);
			width: 735px;
			height: 45px;
		}
		
		.ConteudoPaginaPrincipal
		{
			background-image: url(images/home.png);
			background-repeat: no-repeat;
			width: 712px;
			min-height: 350px;
			border-left: solid 2px #fc8e0c;
			border-right: solid 2px #fc8e0c;
			margin-left: 9px;
			vertical-align: top;
		}
		
		.RodapePaginaPrincipal
		{
			background-image: url(images/pagina_10.png);
			width: 735px;
			height: 32px;
		}

[]'s

 

Thyago

[William Bruno 1501]

Adicione um CSS reset:

* {
  margin: 0;
  padding: 0;
}

acontece isso, pq os browsers tem valores default para os margins do body.

[Thyago Brasil 0]

Willian,

 

Muito bom!!!

 

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

 

Obrigado a todos também que me ajudaram dando as dicas!!

 

Abraços!

[Thyago Brasil 0]

Pessoal,

 

Apenas mais uma dúvida.

 

Este código esta funcionando corretamente no Chrome e Safira porém no Firefox e Opera, ele esta jogando a tela pra fora da div central. Existe um hack que eu possa corrigir isto?

 

Vejam a imagem como ficou!!

 

 

P.S.: Não testei ainda no Internet Explorer

 

Agradeço a todos pela atenção! http://forum.imasters.com.br/public/style_emoticons/default/joia.gif

 

Thyago

[Thiago Retondar 18]

Não poderia postar um link? Fica bem mais fácil.

[Thyago Brasil 0]

Não poderia postar um link? Fica bem mais fácil.

Ele não esta no ar Thiago. Tenho apenas ele funcionando internamente.

[Thiago Retondar 18]

Bem se você está fazendo um site, uma hora via ter que colocar ele na internet. http://forum.imasters.com.br/public/style_emoticons/default/assobiando.gif Usa o 000WebHost, é um servidor gratuito, aceita bancos de dados e PHP e não possui propagandas. http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

 

Ou ao menos poste as imagens. http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif