JSFiddle - React, Tailwind, and code Playground

HTML

<div id="increased">
    <span class="line">This is a really long line that will wrap inside this particular div a couple of times to demonstrate "uneven" line spacing.</span>
</div>

<div id="increased">
    <span class="line">This is a short line with extra line height.</span>
</div>

<div id="normal">
    <span class="line">This is a short normal line.</span>
</div>

CSS

div
{
    background-color: #CCC;
    width: 300px;
    
    margin: 10px;
}

#increased
{
    line-height: 4em;
}

#increased:first-line
{
    line-height: normal;
}

.line
{
    background-color: #FFC;
}