3 columns layout, want middle column to stretch wider when column 1 and 3 are empty
- by Blankman
I have a 3 column layout using table-less design.
<div id="main">
<div id="left"></div>
<div id="content"></div>
<div id="right"></div>
</div>
The CSS:
#left {width: 200px;float:left;display:inline;}
#content {width: 600px;float:left;display:inline;padding: 0 10px;}
#right {width: 160px;float:left;display:inline;}
I am using a web application, and I can't change the layout. By can't change, I mean the div's with left/content/right cannot be removed.
On some pages, both the left and right columns are completely empty. And I want the #content div to expand more than the 600px.
is this possible, without altering the HTML? What are my options?
Thanks allot!