JSFiddle - React, Tailwind, and code Playground

HTML

<div id="tableContain">
    <div id="tabRow1">
        <div id="tabCell">The gibberish (nonsense text) presented here </div>
        <div id="tabCell"> <img src="images/Flora/tree-of-life.jpg" /> </div>
        <div id="tabCell">The gibberish (nonsense text) presented here </div>
    </div>

    <div id="tabRow2">
        <div id="tabCell">The gibberish (nonsense text) presented here </div>
        <div id="tabCell"> <img src="images/Flora/tree-of-life.jpg" /> </div>
        <div id="tabCell">The gibberish (nonsense text) presented here </div>
    </div>
</div>

CSS

#tableContain {
    display: table;
    width: 600px;
    margin: auto;
    border-spacing: 10px;
}

#tabRow1, #tabRow2 {
    display: table-row;
}

#tabCell {
    display: table-cell;
    border: 2px solid gray;
    padding: 10px;
    border-collapse: collapse;
    width: 33%;
}

img {
    width: 200px;
}