Een website layout in twee kolommen

 Maak een tabel met 1 rij en twee kolommen. De tabel krijgt standaard een breedte van 100 % en een rand (border) van 1.
 Maak in de linkerkolom een ongenummerde lijst met menu-items (<ul>), bijvoorbeeld

* Start * Over ons * Onze werking * Kalender * Contact

 Maak een korte welkom-tekst in de rechterkolom
 Selecteer de linker cel door er met de rechter muisknop in te klikken:

 Kies ’Tabelcel eigenschappen’ en het tabblad ’Cellen’ Geef de cel een breedte van 180 pixels
 Geef de linker cel een achtergrondkleurtje: klik op de knop naast ’Achtergrondkleur’ en kies een lichte kleur

 Klik ’Volgende’: u ziet dat nu de tweede cel wordt geselecteerd. Zorg ervoor dat het vakje ’Breedte’ leeg is. Op die manier behoudt de linkerkolom zijn vaste breedte en vult de rechterkolom de rest van de beschikbare vensterbreedte in.

 Sla de pagina op met als bestandsnaam index.html (en voer een titel in), schakel naar Firefox en bekijk het resultaat.

De tekstjes ’zweven’ halfweg tussen boven- en onderrand van de tabel. Om ze bovenaan uit te lijnen gaat u als volgt te werk:

 Klik met de rechter muisknop in de rechtercel en kies ’Tabelcel eigenschappen’
 Zet in ’Inhoudsuitlijning’ de verticale uitlijning (Vert) op ’Boven’

 Klik ’Vorige’ en doe hetzelfde met de linkercel
 Sla de pagina op en bekijk het resultaat in Firefox; klik ’Huidige pagina vernieuwen’.

Nu moet u nog maar één ding doen: de tabel- en celranden weghalen; die moesten immers enkel zorgen voor een goed zicht op de structuur van de pagina en zijn nu eerder storend.

 Zet uw werkvenster in HTML-tags weergave
 CTRL-klik op het ’TABLE’ label: de tabel wordt geselecteerd
 Klik nu rechts op het TABLE label of op de <table> tag onderin het werkvenster en kies ’Tabeleigenschappen’
 Zet onder ’Randen en ruimte’ de rand op 0 pixels.
 Bewaar de pagina, switch naar Firefox en bekijk het resultaat.