Ik zou het als volgt doen.
'n Heel groot deel van die pagina (ik noem hem even de agenda voor het gemak) is dus precies hetzelfde: menu, header, wanneer geüpdate. In principe kun je dus gewoon de héle pagina home kopiëren en dan als naam agenda.html geven (of 'n andere naam natuurlijk).
Ik had het al eerder over kopiëren. En ik bedoel dus echt gewoon de héle pagina. Het is veel makkelijker om alles te kopiëren en dan weg te halen wat er niet in hoeft. Dat is veel makkelijker dan stukje voor stukje onderdelen te kopiëren. (In dit geval, niet altijd natuurlijk.)
De <h1> kun je gewoon aanpassen naar iets als 'Evenementen', of wat dan ook.
Als je geen <h2> nodig hebt, haal je die gewoon weg. Alleen 'n <h1> is min of meer echt nodig, <h2>, <h3>, enz. alleen als 't zo uitkomt.
Als de tip van de dag er niet in moet, haal je die er gewoon uit.
Enz. Tot er alleen nog maar staat wat er in moet blijven staan. Dus de tekst in het midden haal je ook weg.
Nu kun je de tabel er gewoon in kopiëren. Maar niet deze tabel, want ik word hier 'n beetje bedroefd van

Ik zie dat width, height, bgcolor, en o gruwel zelfs font, color en center hebben toegeslagen.
Dat geeft foutmeldingen bij 'n strict doctype, en dat was eigenlijk ook precies de bedoeling. Dit zijn allemaal afgekeurde eigenschappen, die in de css thuishoren. Daardoor wordt de code veel kleiner en veel en veel makkelijker te onderhouden.
'n Tabel kun je net zo met css behandelen als alle andere elementen.
HTML:
<TABLE BORDER="5" BGCOLOR="#000000">
Kan ook als
Code:
table {
border: black solid 5px;
background-color: black; /* of #000000, of #000, net wat je wilt */
text-align: center; /*
}
Zo kun je al die opmaakdingen uit de tabel verplaatsen naar de css. Als je dan later 'n kleurtje wilt veranderen of zo, kan dat gewoon op 1 plaats, in plaats van op tig plaatsen in de tabel.
In dit geval is 'n tabel trouwens prima geschikt. 'n Tabel hoort niet voor lay-out gebruikt te worden, maar juist wel voor dit soort dingen als agenda's.
Dat zou er dan ongeveer zo uit gaan zien:
HTML:
<head>
<title></title>
<style type="text/css">
table {text-align: center; border: black outset 5px; background: black;}
tr#kop {height: 30px; font-size: 1.1em; font-weight: bold; color: #c0c0c0; background: #c30;}
tr#kop td {width: 200px;}
tr {height: 40px; background: #00c; color: #ff0;}
</style>
</head>
<body>
<table>
<tr id="kop">
<td>Naam evenement:</td>
<td>Locatie:</td>
<td>Datum:</td>
<td>Bijzonderheden:</td>
</tr>
<tr>
<td>go apres ski</td>
<td>ahoy Rotterdam</td>
<td>20-03-2010</td>
<td>evenement</td>
</tr>
</table>
</body>
* De letters in de tweede rij zijn erg klein in Google Chrome en Opera, moet je nog even naar kijken misschien.
* De bovenste rij wijkt af. Die heb ik 'n id="kop" gegeven. Als ik nu in de css tr#kop gebruik, dan heeft die meer gewicht dan alleen tr. Omdat er naast het element (tr) nog 'n id (kop) bij staat. Dus ik kan afwijkende css opgeven voor tr#kop en daarna css voor alleen tr. Die is dan voor de rest van de tabel, want ik neem aan dat alle rijen verder hetzelfde moeten zijn.
Dus hoewel tr ná tr#kop komt in de css, 'wint' tr#kop door de id die erbij staat.
* De border moet je misschien ook nog even mee spelen. Dat is nogal verschillend in de diverse browsers. Ik zou even kijken welke breedte en welke soort (outset, inset, groove, ridge) er het best uitzien. En de kleur wil ook nog wel 'ns enorm schelen, grijs in plaats van zwart of zo.
* Ik heb kleine letters voor de tags gebruikt. Bij html mogen kleine en hoofdletters, dus als jij liever met hoofdletters werkt is dat prima.