Ungeachtet des bereits vorhandenen Vorschlag hätte ich noch einen:
<ul class="chronik">
<li>
<h2>2001</h2>
<p>Text 1</p>
<p>text 2</p>
</li>
<li />
<li />
</ul>
Die li-Elemente erhalten einen entsprechenden Aussenabstand auf der linken Seite (oder das ul-Element einen Innenabstand).
Das h2-Element wird rauspositioniert.
Alternativ kann das h2-Element gegen eine andere Überschriftenebene ersetzt werden.
Vorteil dieser Lösung: imho einfacher per CSS gestaltbar als eine pure Defintionsliste (siehe auch Malcolms Einwand) und produziert auch weniger Markup.
Haken: wenn der Abschnitt eines Jahres mehrere Absätze hat, versagt die Lösung - dann ist wieder eine Liste als Kind von Vorteil.
Rein Semantisch gesehen ist eine pure Definitionsliste wie sie Gunnar vorschlägt aber die bessere Wahl - und schwierig zu formatieren ist sie (mit gezieltem Einsatz von float: left;
und float: right;
) eigentlich auch nicht.