JSFiddle - React, Tailwind, and code Playground

HTML

<div id="wrapper">
    <div id="col1" class="col">
        <p>Col 1</p>
        <p>Col 1</p>
        <p>Col 1</p>
        <p>Col 1</p>
        <p>Col 1</p>
        <p>Col 1</p>
        <p>Col 1</p>
        <p>Col 1</p>
    </div>
    <div id="col2" class="col">
        <p>Col 2</p>
        <p>Col 2</p>
        <p>Col 2</p>
        <p>Col 2</p>
        <p>Col 2</p>
    </div>
    <div id="col3" class="col">
        <p>Col 3</p><p>Col 3</p><p>Col 3</p><p>Col 3</p><p>Col 3</p><p>Col 3</p><p>Col 3</p><p>Col 3</p><p>Col 3</p>
    </div>    
</div>

CSS

#wrapper{
    display:table;
    width:100%;
}
.col{
    display:table-cell;
    width:33%;
    padding:5px;
}
#col1, #col2, #col3{
    background:yellow;
}
#col2{   
    border-left:2px dotted black;
    border-right:2px dotted black;
}