JSFiddle - React, Tailwind, and code Playground

HTML

<dl>
    <p><dt>Email</dt><dd>[email protected]</dd></p>
    <p><dt>Phone</dt><dd>(555) 123-4567</dd></p>
    <p><dt>Bio</dt><dd>Person's full-text bio, which spans multiple lines, and starts on the same line as the text <q>Bio</q>, just like the previous definitions. Any given solution should both allow this text to wrap below the &lt;dd&gt; and then provide a line break afterwards.</dd></p>
</dl>

CSS

dt {
    font-weight: bold;
    display: inline-block;
}

dd { display: inline; }