Log in

View Full Version : Auto Expanding Div



Coding Coder
02-28-2011, 11:18 AM
Hi guys. I am creating a template (see attached image) And I am trying to add a DIV that auto expands as and when content is added to another DIV.

Bascially I have flyout menu on the left and to the right of that I have the main contents area for my page. Now the flyout menu is about 300 px high and a green colour. This means below it there is a big white gap. What I want to do is create an empty DIV below that that is the same colour as the flyout menu. So that when the contents section of the page gets bigger (height wise0 than the flyout menu the below div will auto expand, which will give the appearance of a single green column down the left hand side.

Hope that makes sense.

The only way I can find around it is by matching up the height of the DIV in pixels so that it is level with the conents section, but this would mean manually changing the height every time I do an update and create a new page.

Any help would be greatly appriciated.

Many Thanks

Coding Coder
02-28-2011, 11:31 AM
I have just tried using

<div style="clear:both; line-height:1px; font-size:1px; height:1px;">&nbsp;</div>

and that seems to make the empty div match the height of the contents div but the background is still white and there is no way for me to change the colour. How can I overcome this problem?

Coding Coder
02-28-2011, 11:39 AM
scrap that it didnt work and Im back to where I was before.

coothead
02-28-2011, 02:04 PM
Hi there Coding Coder,

check out the attachment to see a possible solution to your problem. ;)

coothead