[CSS] 3 Column layout, 2 fixed width, 1 stretch?

[Duncank]

Ik ben bezig met het maken van een pagina bestaande uit 3 divs naast elkaar. De buitenste twee divs hebben een vaste breedte, de middelste wil ik het gat laten opvullen.

code:

div.menu {
   height : 100%;
   width : 246px;
   float : left;
   position : relative;
}

div.sidebar {
   height : 100%;
   width : 25px;
   float : left;
   position : relative;
}

div.content {
   height : 100%;
   width : ?;
   float : left;
   position : relative;
}


<div class="menu"></div>
<div class="content"></div>
<div class="sidebar"></div>

Ik heb al een heel aantal dingen geprobeerd en veel voorbeelden op internet doorgekeken, maar dit heeft nog niet tot een oplossing mogen leiden.

Wat ik wel vaker tegenkwam en ook al geprobeerd heb, is om de content-div een position:fixed of :absolute te geven, met een margin-left van 246px en right van 25px, maar met een width van 100% of width:auto, lijkt dat nog niks op te lossen.

Kan iemand mij misschien wat meer in de goede richting sturen?

[Verwijderd]

Ik gebruik normaal altijd de volgende website om mij uit de problemen te helpen:

http://www.dynamicdrive.com/style/layouts/

Hoop dat je er iets aan hebt.

[mcDavid]

Je kunt gewoon één wrapper maken, de linker- en rechter kolom naar links en rechts floaten, dan komt de content in de wrapper er vanzelf tussen te staan.

[Duncank]

Dankjewel! Ik heb de dynamicdrive site eens bekeken en ik denk dat die mij hierbij heel goed gaat helpen!

Het probleem dat ik tegenkwam met het links en rechts floaten van de static kolommen is dat het content vak dan net zo breed werd als de content erin. Deze div wil ik echter net zo breed laten worden als de open ruimte, dus niet afhankelijk van de tekst.