JSFiddle - React, Tailwind, and code Playground

HTML

<div id="wrap">
    <div class="a">a</div><div class="b">b</div><div class="d">d</div><div class="b">b</div><div class="c">c</div><div class="a">a</div><div class="b">b</div><div class="a">a</div><div class="c">c</div><div class="a">a</div><div class="d">d</div><div class="b">b</div><div class="b">b</div><div class="d">d</div><div class="b">b</div><div class="c">c</div><div class="a">a</div><div class="b">b</div><div class="a">a</div><div class="a">a</div><div class="d">d</div>
<div class="b">b</div> <div class="a">a</div> <div class="b">b</div> <div class="c">c</div> <div class="a">a</div> <div class="d">d</div> <div class="b">b</div>&nbsp;<div class="d">d</div>&nbsp;<div class="a">a</div>&nbsp;<div class="b">b</div>&nbsp;<div class="b">b</div>
    <div class="c">c</div><div class="a">a</div><div class="b">b</div><div class="a">a</div><div class="b">b</div>
    <div class="d">d</div>
    <div class="d">d</div>
    <div class="b">b</div>
    <div class="c">c</div>
    <div class="a">a</div>
    <div class="b">b</div>
    <div class="a">a</div>
</div>

CSS

#wrap { text-align:justify }
#wrap div { display:inline-block; background:black; padding:0 0.5em; color:white; vertical-align:middle; line-height:70px }
#wrap .a { font-size:5em; background:#300 }
#wrap .b { font-size:2em; background:#030 }
#wrap .d { font-size:3.5em; background:#003 }