I'm hoping someone can point me in the right direction.
I have a 3 column layout. Two menu columns floated right and a main body column. Hopefully you can see the image attached.
The layout works fine in all browsers when all div tags have content within them.
For some pages my 'right' column has no content and so I want the 'left' column to move all the way right to take the place of the 'right' column and the mainbody column to fill the remaining space.
This works great in all latest browsers.
HOWEVER. in IE7 the 'left' column stays put and the main body stays as it was too so there's just a big empty space where the 'right' column was.
It seems that when the div tag is empty the latest browsers know to ignore it and so the left column floats right and the mainbody expands to fill the gap. However on IE7 it does not ignore the 'right' div tag when it's empty.
Hopefully the attachment helps clarify what's happening.
Thanks in advance for any pointers.