I have a 4 column layout with a standard header and footer. Its something like this
<div id="header"></div>
<div id="leftnav"></div>
<div id="maincontent"></div>
<div id="nextcontent"></div>
<div id="addtionalinfo"></div>
<div id="footer"></div>
Something like this http://jsfiddle.net/gaby/mBuf9/
But when there is no content/data in the center i want the right most div to span and take up the entire content space. And similarly if there is no content in the left most div i want the maincontent to span the remaining space. is there a way to do it?