JSFiddle - React, Tailwind, and code Playground

HTML

<section class="faketable">
    <div>
        <span>Lorem.</span>
        <span>Deserunt!</span>
        <span>Debitis?</span>
    </div>
    <div>
        <span>Lorem.</span>
        <span>Asperiores.</span>
        <span>Magnam.</span>
    </div>
    <div>
        <span>Lorem.</span>
        <span>Eos.</span>
        <span>Ut.</span>
    </div>
</section>

CSS

.faketable {
    display: table;
    width: 100%;
    table-layout: fixed;
}
div {
    display: table-row;
}
span {
    display: table-cell;
    background: lightblue;
}

div:before, div:after {
    content: '';
    display: table;
    clear: both;
}

.faketable div:before, .faketable div:after {
    /* No CSS in here can prevent the psuedo elements above from breaking the table */
    content: none;
    display: none;
}