JSFiddle - React, Tailwind, and code Playground

HTML

<div id="words">
<i>milk</i><b>blue</b><i>blind</i><b>perpetual</b>
<i>juice</i><i>jungle</i><i>cleaner</i><i>tiny</i>
<i>lemon</i><i>vitamin</i><b>unheard</b><i>empty</i>
<b>awesome</b><i>pink</i><i>grilled</i><i>mirror</i>
<b>hungry</b><i>opening</i><i>darkness</i><i>apply</i>
<i>burden</i><b>coaster</b><i>rocket</i><i>monster</i>
<i>rolled</i><i>lovers</i><b>plug</b><b>jumping</b>
<b>circus</b><i>bird</i><i>doctor</i><i>endless</i>
<b>golden</b><i>mutate</i><b>scream</b><i>chest</i>
</div>

CSS

#words {
    width: 600px;
    text-align: center;
    overflow: auto
}
#words i, #words b {
    display: block;
    float: left;
    width: 25%;
    padding: 3px 0;
    font-style: normal
}