JSFiddle - React, Tailwind, and code Playground

by sthag

HTML

<dl class="inline">
    <dt>Term</dt>
    <dd>Definition</dd>
    <dt>Long Term</dt>
    <dd>Definition</dd>
    <dt>Term</dt>
    <dd>Definition</dd>
    <dd>Definition</dd>
</dl>

CSS

dl.inline dt, dl.inline dd {
    float: left;
    margin: 0 0.5em 0 0;
    background: #ccc
}

dl.inline dd + dt, dl.inline dd + dd {
    clear: left
}

dl.inline dd + dd {
    float: none
}

dl.inline dt {
    font-weight: bold
}