Problema con layout y divs

[ratamaster]

Hola
Tengo aplicado el siguiente layout en mi sitio web: http://www.krishadlock.com/clients/i...erface/js.html

Es un diseño expandible, y el js que maneja el alto es el siguiente:

Código:

Page = {};

Page.resize = function()
{
	var header = document.getElementById('header');
	var footer = document.getElementById('footer');
	var content = document.getElementById('content');
	var left = document.getElementById('left');
	var right = document.getElementById('right ');
	
	var contentHeight = document.body.offsetHeight - (header.offsetHeight + footer.offsetHeight) +"px";
	content.style.height = contentHeight;
	left.style.height = contentHeight;
	right.style.height = contentHeight;
}

onload = onresize =Page.resize;

css:

Código:

html, body
{
	margin: 0px;
	height: 100%;
}

#header
{
	height: 100px;
	background-color: #333;
	color: #fff;
}

#content div#left
{
	width: 150px;
	float: left;
	background-color: #eaeaea;
}

#content div#gridDiv
{
	float: left;
	margin-bottom:20px;
}

#footer
{
	background-color: #ccc;
	clear:both;
}

Mi problema ocurre cuando en el div "right" tengo otro dív más (dentor de right), el cual cambia su alto al cliquear en unos links que se generan dinámicamente dentro de este div. Al hacer click, este div interior se expande, pero su contenido queda por debajo de footer, y yo no quiero que pase eso, quiero que el footer se mueva hacia abajo, o sea, sea movido hacia abajo porque el otro div se agrandó.
Bueno, gracias y espero que alguien me pueda ayudar :)