JSFiddle - React, Tailwind, and code Playground

HTML

<dl>
    <div class="row"> <dt>Email</dt><p>[email protected]</p> </div>
  <div class="row"> <dt>Phone</dt><p>(555) 123-4567</p></div>
  <div class="row"> <dt>Bio</dt><p>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.</p></div>
</dl>

CSS

dt { float: left; clear: left;  margin-right : 5px;}

p {