html - How to style dt and dd so they are on the same line?

html - How to style dt and dd so they are on the same line? - Stack Overflow

A very simple approach to laying out definition lists with nice alignments using CSS grids. The example CSS is:

dl {
  display: grid;
  grid-template-columns: max-content auto;
}

dt {
  grid-column-start: 1;
}

dd {
  grid-column-start: 2;
}