Skip to content

Description List

Base element styles for <dl>, <dt>, and <dd>. Resets margins and provides consistent defaults.


Base Reset

SelectorPropertyValue
dlmargin0
dtfont-weightvar(--font-weight-medium)
ddmargin-left0

Preview

Term
Definition of the term.

Variants

.detail-row

Horizontal key-value row with bottom border, used for product details.

ClassPurpose
.detail-rowFlex row with gap, padding, and border-bottom
.detail-row dtSecondary color label with min-width
Material
100% organic cotton, 180g/m²
Fit
Regular fit, unisex
Print
Water-based screen print
html
<dl>
  <div class="detail-row">
    <dt>Material</dt>
    <dd>100% organic cotton</dd>
  </div>
  <div class="detail-row">
    <dt>Fit</dt>
    <dd>Regular, unisex</dd>
  </div>
</dl>