Altura de uma div igual da outra

[fekz 0]

Tenho uma div #conteudo que usa include e fica no meio, onde logicamente, é posto o conteudo.

Ela se redimensiona com o css height: auto; de acordo com o tamanho do texto.

 

Do lado esquerdo, tenho um menu chamado numa div #menu e do lado direito um menu chamado #direito.

Queria pegar a altura do #conteudo e deixar os 2 menus com a mesma altura, pois os 2 menus tem cor de fundo AZUL e queria que preenchesse até o fim da página, não deixando espaço em branco.

 

Fiz o seguinte:

 

function redimensiona() {

conteudo = document.getElementById('conteudo').height; // Tentei pegar o HEIGHT do conteudo.

document.getElementById('menu').style.height = 'conteudo'; // Aplicar o HEIGHT do conteudo ao MENU.

document.getElementById('direito').style.height = 'conteudo; // Aplicar o HEIGHT do conteudo ao DIREITO.

}

 

Alguém me ajuda a fazer este script funcionar? Outro erro é que mesmo pondo valores ali no lugar de conteudo por exemplo:

document.getElementById('direito').style.height = '2000px';

O height só funciona no FF no ie6 não.

 

Alguém me dá uma mão?

Valeu

[klaygomes 0]

você pode usar a propriedade offsetHeight que é crossbrowser.

[fekz 0]

function redimensiona() {

conteudo = document.getElementById('conteudo').offsetHeight;

document.getElementById('menu').style.height = 'conteudo';

document.getElementById('direito').style.height = 'conteudo';

}

 

Usei isso, mas não deu certo.

E se eu trocar ali document.getElementById('direito').style.height = '2000px'; funciona só no FF no IE não.

[julio.ti 0]

ACREDITO QUE ISSO RESOLVA

 

function redimensiona() {

var conteudo = window.document.getElementById('conteudo').style.height;

window.document.getElementById('menu').style.height = conteudo+'px';

window.document.getElementById('direito').style.height = conteudo+'px';

}

 

SE NÃO FUNCIONAR TIRA OS +'px` que eu coloquei

 

function redimensiona() {

var conteudo = window.document.getElementById('conteudo').style.height;

window.document.getElementById('menu').style.height = conteudo;

window.document.getElementById('direito').style.height = conteudo;

}

 

ATÉ MAIS!

[fekz 0]

Tentei dessas formas:

function redimensiona() {

var conteudo = window.document.getElementById('conteudo').offsetHeight;

window.document.getElementById('menu').style.height = 'conteudo' + "px";

window.document.getElementById('direito').style.height = 'conteudo' + 'px';

 

}

 

Não deu certo.

tentei conteudo + 'px';

ele aumentou uns 3 pixels, sei lá, mas não foi tudo ;/

 

Algm sabe?

 

SE QUISER dar uma olhada fekz.co.cc/teste.html

[fekz 0]

http://www.fekz.co.cc/teste.html

 

Coloquei isso:

 

function redimensiona() {

var div = document.getElementById('conteudo').clientHeight;

window.alert("A ALTURA DA DIV CONTEÚDO É " +div);

document.getElementById('menu').style.height = div - 25;

document.getElementById('direito').style.height = div;

}

 

Funcionou, deu certo no IE6 e 7.

Não funcionou no FF.

Alguma ajuda?