css column design met middle column fixed width

[brokenp]

Hoi,

Ik ben een beetje aan het stoeien met het converteren van een table design naar een css/div oplossing, echter ik loop tegen een probleem aan waar ik niet uitkom.

Ik heb een 3 column lay out (columns A,B en C) waarbij column B exact 800px breed moet zijn en gecentreerd. De kollommen A en C moeten de resterende ruimte opvullen.


Als ik de volgende code gebruik werkt het niet:

code:

div.B{
        height:200px; 
    width:800px;
    margin:0px auto; /* Right and left margin widths set to "auto" */
}
div.A{
         height:200px; 
         float:left;
         border: solid red 5px;
         margin: 0px auto;
}

Ik heb al gegoogled, A list apart gezocht e.d. Ik kom eigenlijk vooral designs tegen met de middelste kollom liquid.

Ik wil expliciet geen table of javascript oplossing!

[ Voor 5% gewijzigd door brokenp op 05-05-2006 14:00 ]

[Facer]

Probeer dit is bij je stylesheet toe te voegen

code:

html, body {
 height:100%;
 min-height: 100%;
}

body {
 text-align:center;
}

div.B{
        height:200px; 
    width:800px;
    margin:0px auto; /* Right and left margin widths set to "auto" */
}

[ Voor 43% gewijzigd door Facer op 05-05-2006 14:54 . Reden: Wijziging van de vraag (div.b toegevoegd) ]

[brokenp]

Hmm, ik ben denk ik niet echt duidelijk geweest.

Ik heb nu een werkende kollom die 800 breed is en gecentreerd.
Het probleem is echter dat ik niet weet hoe ik de kollomen A en C volledige resterende breedte kan geven.

[Verwijderd]

Elementen buiten de flow kun je niet meer relatief aan andere elementen laten schalen.
Ik zou 1 div maken met een breedte van 100% en dan doormiddel van een achtergrondplaatje het idee van 3 kollommen kreeeren. De rest van de elementen kun je dan absoluut positioneren.
Groot voordeel is dat de funktionele opmaak onafhandelijk wordt van de grafische opmaak.

[Technicality]

En dat is gelijk het nadeel, want met die methode (faux columns-achtig) kun je niet kolommen aparte groottes meegeven.

Absoluut positioneren lijkt me inderdaad de enige 'nette' oplossing...