JSFiddle - React, Tailwind, and code Playground

by mischah

HTML

<dl>
    <dt>term</dt>
    <dd>description</dd>
    <dt>term</dt>
    <dd>description</dd>
</dl>

CSS

dl, dt, dd {
    margin: 0;
    padding: 0;
}
dt, dd {
    display: inline;
}
dt {
    font-weight: bold;
    display: inline-block;
}
dt:before {
    display: block;
    color: pink;
    content: "separator";
    font-weight: normal;
}
dt:after {
    content: ":";
}
dd {
    padding-left: 0.5em;
    display: block;
}