<div>
<div>Top Text</div>
<div><span>A</span><span>B</span><span>C</span></div>
</div>
The idea is to have something like:
Top Text
A B C
Where Top Text is always lined up with the starting and ending text on the bottom.
In this particular case, flexbox can do the job:
.box {
display:inline-block; /* fit content */
}
.box > div:last-child {
display:flex;
justify-content:space-between;
}<div class="box">
<div>Top Text</div>
<div><span>A</span><span>B</span><span>C</span></div>
</div>