JSFiddle - React, Tailwind, and code Playground

HTML

<div class="clearfix holder">
    <div class="column left">
        Some Contents Here...
    </div>
    <div class="column middle">
        Some Contents Here...
    </div>
    <div class="column right">
        Some Contents Here...
    </div>
</div>

CSS

.clearfix:before,
.clearfix:after {
    content: " ";
    display: table;
}
.clearfix:after {
    clear: both;
}
.clearfix {
    *zoom: 1;
}
.holder{
    text-align:center;
}
.column{
    display:inline-block;
    *display:inline;
    *zoom:1;
    width:auto;
}
.left{
    background-color:#ff0;
    float:left;
}
.middle{
    background-color:#f0f;
    margin:0 auto;
}
.right{
    background-color:#0ff;
    float:right;
}