JSFiddle - React, Tailwind, and code Playground

by sstur

HTML

<div class="container">
    <div class="one col">
        <p>Content</p>
    </div>
    <div class="two col">
        <p>Content</p>
    </div>
    <div class="three col">
        <p>Content</p>
    </div>
</div>

CSS

.container {
    min-width: 400px;
    max-width: 700px;
    width: 100%;
    display: table;
    background: #eee;
    margin: 10px auto;
}
.one, .two, .three {
    width: 33%;
    display: table-cell;
    text-align: center;
}
p {
    width: 100px;
    height: 100px;
    background: #009;
    margin: 10px auto;
    /*
    position: relative;
    */
}
/*
.col:first-child p {
    left: 12.5%;
}
.col:last-child p {
    left: -12.5%;
}
*/