JSFiddle - React, Tailwind, and code Playground

HTML

<p>
    Внешний текст:
    <span class="one">
        strut 1
        <i>Раз</i>
        <i>Два</i>
    </span>

    <span class="two">
        strut 2
        <i>Раз</i>
        <i>Два</i>
        
    </span>

</p>

CSS

p { border: 1px solid blue; }
span , i {
        display: inline-block;
        border: 1px solid red;
        vertical-align: bottom;
}

.one > i {
    height: 60px;
    border: 1px solid blue;
    vertical-align: top;
}

.one > i + i {
    vertical-align: bottom;
        height: 100px;
}
.two {height:100px;}
.two > i {
    height: 60px;
    border: 1px solid green;
    vertical-align: top;
}