JSFiddle - React, Tailwind, and code Playground

by tibum

HTML

<dl class="twocolumn">
    <dt>Title 1:</dt>
    <dd>The quick brown fox jumps over the lazy dog.</dd>
    <dt>Title 2:</dt>
    <dd>The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog.</dd>
    <dt>Title 3:</dt>
    <dd>The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog.</dd>
</dl>

CSS

dl.twocolumn {
    overflow: auto;
}
dl.twocolumn dt, dl.twocolumn dd {
    float: left;
}
dl.twocolumn dt {
    clear: left;
    width: 23%;
    margin-right: 2%;
    font-weight: bold;
}
dl.twocolumn dd {
    width: 75%;
    margin-left: 0;
}