JSFiddle - React, Tailwind, and code Playground

HTML

<div class="mydiv">
    <span><span>Frameworks and Extensions</span></span>
</div>

CSS

.mydiv {
    width:100px;
    height:70px;
    border:1px solid red;
    position:absolute;
    text-align:center;
    background-color:#ccc;   
    
    display: block;
    line-height: 65px; /* 70px applied on 1st span */
}
.mydiv>span {
    display: inline-block;
    vertical-align: middle; /* 2nd span centered */
    line-height: 0;
}
.mydiv>span>span {
    line-height: 20px; /* here's the "true" line-height */
}