[Resolvido] Fundo que acompanha a altura

[Cesão 1]

Olá amigos,

minha dúvida deve ser simples, mas sempre que eu tento nao consigo fazer isso.

 

o site do meu cliente é assim:

Site

 

O fundo, como vcs podem ver, possuem detalhes de como se fosse uma foto. Gostaria de saber o seguinte.. como fazer para que, quando aumentarmos o conteudo, o detalhe da direita (ou seja, de baixo) acompanhe o final do retangulo branco? Quanto mais conteudo, mais vai aumentar verticalmente o retangulo branco e eu queria que o detalhe da direita acompanhasse o final do retangulo branco. como fazer?

[brcontainer 16]

Esse assunto já foi falado no forum

tem o (Técnica "Faux Columns" para layouts CSS ): http://forum.imasters.com.br/index.php?showtopic=225319

as vezes ajuda.

 

Mas na maioria das vezes é bom criar um elemento PAI que englobe ambos elementos citados

e o elemento PAI tenha um fundo com uma imagem que tenha repeat-y somente.

 

Bem não pude analizar bem o seu site pois ele é uma imagem ;)

[Cesão 1]

Bom silverfox, na verdade não era bem disso que eu estava falando. rs

o que quero dizer eh o seguinte. veja o link abaixo:

 

http://komodomedia.com/

 

no meio vcs vao encontrar uma imagem. imagine que essa imagem eh maior, como um layout.

dai o que acontece eh o seguinte.. imagine que o conteudo de texto do meio vai aumentando, ou seja, o meio tbm que aumentar a altura. soh que as flores de cima tem que se manter em cima e as folhas de baixo tem que acompanhar o conteudo.. tipo, nao importa o tamanho do conteudo, as folhas de baixo sempre vao estar lá embaixo. não posso simplesmente tacar como um rodapé, pois as imagens nao tem que estar embaixo do conteudo, e sim de fundo dele, como na pequena imagem que coloquei de exemplo.

 

Para entender um pouco melhor, minha estrutura atual está assim:

 

<div id="fundo">
	<div id="site">
	</div>
</div>

O meu css está assim:

#fundo {width:824px; min-height:990px; _height:990px; position:absolute; left:50%; margin-left:-412px; background:url(../img/bg_leafs_bottom.jpg) bottom center no-repeat;}
#site {width:598px; position:absolute; left:50%; margin-left:-299px;}

mas quando o "site" aumenta, o "fundo" não acompanha e a imagem, consequentemente, tbm não.

[Cesão 1]

Pessoal, resolvi. hehehe

Do nada me deu uma esclarecida aqui na cabeça e resolvi mudar o position do #site e deu certo.

 

coloquei o position do site como RELATIVE e acho que daí ele obedeceu ao #fundo e a imagem de fundo acompanhou!