JSFiddle - React, Tailwind, and code Playground

HTML

<h3>Foo</h3>
<p>25<span class="unit">Kg</span></p>
<h3>Bar</h3>
<p>9 <span class="unit">%</span></p>

<h3>Bar</h3>
<p>999999 <span class="unit">%%%%</span></p>

CSS

p {
    position: relative;
    width: 3.5em;
    padding: 0.5em 3.5em 0 0;
    margin: 0 auto;
    text-align: right;
}

.unit {
    position: absolute;
    top: -0.5em;
    right: 0px;
    width: 3.5em;
    text-align: left;
}