Wie erstelle ich ein 3-Säulen-Layout mit flüssiger Mitte ohne Schwimmer?

Ich versuche, ein dreispaltiges Layout mit statischen Seitenleisten und einer flüssigen Mittelsäule zu erstellen. Ich möchte nicht, dass die Spalten abfallen, wenn die Seite zu schmal wird (mittlere Spalte bei 250px). Ich möchte, dass das Ganze einfach eingefroren wird und Side-Scrolling angewendet wird. Ich bin mir ziemlich sicher, dass dies mit Schwimmern nicht möglich ist. Folgendes habe ich bisher:

http://jsfiddle.net/eNDPG/210/

HTML:

<div id="header">
    Header
</div>
<div id="container">
<span id="leftcol">
     Text1
</span>
<span id="rightcol">
    Text3
</span>  
<div id="centercol">
    Text2
</div>
</div>
<div id="footer">
    Footer
</div>

CSS:

#container {
overflow:hidden;
width: 100%;
float: left;
}

#leftcol {
border: 1px solid #0f0;
display: inline-block;
float: left;
width: 200px;
}

#rightcol {
border: 1px solid #0f0;
display: inline-block;
float: right;
width: 250px;
}

#centercol {
border: 1px solid #000;
overflow: hidden;
}

#header {
border: 1px solid pink;
width: 100%;
}

#footer {
border: 1px solid pink;
width: 100%;
}

Antworten auf die Frage(2)

Ihre Antwort auf die Frage