Jump to content


Photo

Divs Com O Mesmo Tamanho Segindo A De Maior Conteúdo


  • Faça o login para participar
5 replies to this topic

#1 rivenhp

rivenhp

    Novato no fórum

  • Usuários
  • 4 posts
  • Sexo:Masculino

Posted 05/08/2009, 09:01

Olá Pessoal,

Estou com o seguinte problema: montei um layout com três colunas, as quais contêm um menu, o conteúdo central principal e um conteúdo lateral, necessito que as três colunas se extendam até o final, atingindo o rodapé da página, a questão é como o conteúdo central é variável, não posso definir um valor absoluto para as colunas laterais, pois se o conteúdo central ultrapasar esse valor as colunas laterais não o seguem, a pergunta é, como consigo isso então?

A imagem é mais ou menos o que está acontecendo, a div 1, a div 2 e a div 3 têm de todas terem seu tamanho definido por aquela que apresentar o maior conteúdo.

Attached File  site.gif   17.15KB   9 downloads

Desde já obrigado!

#2 Édipo Costa Rebouças

Édipo Costa Rebouças

    Veterano

  • Ex-Admins
  • 1079 posts
  • Sexo:Masculino
  • Localidade:Brasil - São Paulo

Posted 05/08/2009, 12:54

coloque uma div em volta das três colunas, e use uma imagem de 1px de fundo se repetindo verticalmente, com as cores das divs, e suas posições.

#3 rivenhp

rivenhp

    Novato no fórum

  • Usuários
  • 4 posts
  • Sexo:Masculino

Posted 06/08/2009, 14:13

Então Édipo isso eu já tinha tentado.

O problema é que colocando essa div englobando todos os 3 divs em questão, pra ela funcionar, eu tenho de dar um position:absolute nela, e isso faz com que o rodapé fique pra cima, pois meu rodapé é fluído na horizontal. dá uma olhada no link abaixo para vocês entenderem:

Link do Problema

#4 GuigoR10

GuigoR10

    Novato no fórum

  • Usuários
  • 6 posts
  • Sexo:Não informado

Posted 06/08/2009, 14:38

Acredito que você possa tentar utilizar do método false-column, que consiste em você fazer um bakcground (imagem) para o otodo, ou seja, um background de 1px de ALTURA, reptindo no eixo y e pegando as 3 divs de largura, diferenciando-as em cores, nos backgrounds. Com isto, qualquer das 3 divs que crescerem, sempre a maior ditará o tamanho das 3, pois o background complementará o vazio. Essa é uma das saídas que utilizao para websites deste padrão.
Espero ter ajudado.

#5 Édipo Costa Rebouças

Édipo Costa Rebouças

    Veterano

  • Ex-Admins
  • 1079 posts
  • Sexo:Masculino
  • Localidade:Brasil - São Paulo

Posted 06/08/2009, 15:58

troque o código de #contcentro por esse
#contcentro {
	background-image: url(../images/fundo_centro.gif);
	background-repeat: repeat-y;
	width: 962px; overflow: hidden;


}

Edição feita por: Édipo Costa Rebouças, 06/08/2009, 16:08.


#6 rivenhp

rivenhp

    Novato no fórum

  • Usuários
  • 4 posts
  • Sexo:Masculino

Posted 08/08/2009, 01:33

Grande Édipo,

Era exatamente isso que faltava. Funcionou certinho.

Valeu muito aí pela ajuda!




1 user(s) are reading this topic

0 membro(s), 1 visitante(s) e 0 membros anônimo(s)

IPB Skin By Virteq