JSFiddle - React, Tailwind, and code Playground

HTML

<div class="chkbx">
    <div class="ratings"> 
        <span class="bx">1</span>
        <span class="bx">2</span>
        <span class="bx">3</span>
        <span class="bx">4</span>
        <span class="bx">5</span>

    </div>
    
    <div class="ftext"> Some full text here </div>
    
     <div class="ratings"> 
         <span class="bx">Lorem<input type="checkbox" /></span>
         <span class="bx">Lorem <input type="checkbox" /></span>
         <span class="bx">Lorem <input type="checkbox" /></span>
         <span class="bx">Lorem <input type="checkbox" /></span>
         <span class="bx">Lorem <input type="checkbox" /></span>

    </div>

    
    <div>

CSS

.chkbx {
    width:100%;
}
.ratings {
    display:table;
    width:100%;
    border:1px solid #F00;
}
.ratings > span {
    display:table-cell;
    border:1px solid #000;
    width:20%;
}