DL styling with CSS grid

by David Joseph Guzsik

HTML

<dl>
  <dt>&bull;</dt>
  <dd>Content 1</dd>

  <dt>&bull;</dt>
  <dd>Content 2</dd>
</dl>

CSS

dl {
      display: grid;
      grid-template-columns: auto 1fr;
      gap: 1em;
    }

    dt {
      grid-column: 1;
    }

    dd {
      grid-column: 2;
    }