<main>
  <h1>Definition Lists</h1>
  <h2>Default styling</h2>
  <dl>
    <dt>1599</dt>
    <dd>Oliver Cromwell born, a direct descendant of Katherine, the elder sister of Thomas Cromwell. (Thomas Cromwell, Chief Minister to King Henry VIII from 1532 to 1540, was beheaded in 1540.)</dd>
    <dt>1603</dt>
    <dd>Elizabeth I, the last of the Tudors, died - succeeded by James I (VI of Scotland), the first of the Stuart Kings of England, Scotland and Ireland (England then included Wales).</dd>
  </dl>
  <h2>With Custom Styling</h2>
  <dl class="floated">
    <dt>1599</dt>
    <dd>Oliver Cromwell born, a direct descendant of Katherine, the elder sister of Thomas Cromwell. (Thomas Cromwell, Chief Minister to King Henry VIII from 1532 to 1540, was beheaded in 1540.)</dd>
    <dt>1603</dt>
    <dd>Elizabeth I, the last of the Tudors, died - succeeded by James I (VI of Scotland), the first of the Stuart Kings of England, Scotland and Ireland (England then included Wales).</dd>
  </dl>
  <p><a href="https://www.sitepoint.com/community/t/what-markup-would-you-use-for-this/275699?u=sama74">https://www.sitepoint.com/community/t/what-markup-would-you-use-for-this/275699?u=sama74</a></p>
</main>
main {
  max-width: 43em;
  margin: 1em auto;
}
.floated dt {
  float: left;
  margin-right: 1em;
  font-weight: bold;
}
.floated dd {
  margin: 0 0 1em;;
}
Run Pen

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.