JSFiddle - React, Tailwind, and code Playground

by Pik_at

HTML

<div class="red">
    <div class="blue">content1</div>
    <div class="blue">content2</div>
    <div class="blue">content3</div>
    <div class="blue">content4</div>
    <div class="blue">content5</div>
    <div class="blue">content6</div>
</div>

CSS

.red, .blue {
    -moz-box-sizing:    border-box;
    -webkit-box-sizing: border-box;
    box-sizing:        border-box;
}

.red {
    width:650px;
    height:1000px;
    background:red;
    overflow: hidden;
    padding: 1% 0 0 1%;
}

.blue {
    height:200px;
    width: 24%;
    background:blue;
    display:inline-block;
    float: left;
    margin: 0 1% 1% 0;
}