De aanleiding

Naar aanleiding van wat Bart zei in één van zijn laatste berichten, ik citeer:

Het zal volgens mij niet lang duren vooraleer deze evolutie de webdesigns zal gaan beïnvloeden. Ik verwacht dat websites drie kolommen zullen hebben, met in de rechtse kolom ‘nice to know’ informatie.
Bart

zullen veel designers ooit voor de moeilijke opgave komen te staan om een multi-kolommen layout aan te maken, en hoe doe je dit nu zonder tabellen ?

Er zijn veel wegen naar….

Zoals ieder zijn eigen manier heeft om iets te verwezenlijken, zijn er ook nu verschillende manieren om dit teweeg te brengen, en zoals altijd verdedigd iedereen zijn eigen manier.

Nu wil ik niet zeggen dat mijn manier de beste zal zijn, waarschijnlijk wel maar kom, het zal de gemakkelijkste manier zijn, zonder al te veel te moeten klooien met position: absolute en andere “ik-maak-het-toch-lekker-moeilijk” manieren, ik deed het vroeger ook zo.

3 kolommen, 1 manier

Structuur

<div id="container">
<div class="kolom1">
... inhoud komt hier....
</div>
<div class="kolom2">
... inhoud komt hier....
</div>
<div class="kolom3">
... inhoud komt hier....
</div>
</div>

Met float heb je de volledige macht over je positionering, dus gewoon alle kolommen float: left, en hop je 3 kolommen layout is klaar.

Een voorbeeld ervan kan je bekijken, lees de broncode om het te begrijpen.

4 kolommen, dezelfde manier

Structuur

<div id="container">
<div class="kolom1">
... inhoud komt hier....
</div>
<div class="kolom2">
... inhoud komt hier....
</div>
<div class="kolom3">
... inhoud komt hier....
</div>
<div class="kolom4">
... inhoud komt hier....
</div>
</div>

4 kolommen, geen probleem.

Een voorbeeld ervan kan je bekijken, lees de broncode om het te begrijpen.

5 kolommen, hebben we dat nodig ?

Nodig of niet, het is mogelijk, ook weer op dezelfde manier als voorgaande voorbeelden.