JSFiddle - React, Tailwind, and code Playground

by Vipin Patil

HTML

<div class="gallery">
    <div class="pic">test 1</div>
    <div class="pic">test 2</div>
    <div class="pic">test 1</div>
    <div class="pic">test 2</div>
    <div class="pic">test 1</div>
    <div class="pic">test 2</div>
    <div class="pic">test 1</div>
    <div class="pic">test 2</div>
    <div class="pic">test 1</div>
    <div class="pic">test 2</div>
    <div class="pic">test 1</div>
    <div class="pic">test 2</div>
    <div class="pic">test 1</div>
    <div class="pic">test 2</div>
    <div class="pic">test 1</div>
    <div class="pic">test 2</div>
    <div class="pic">test 1</div>
    <div class="pic">test 2</div>
    <div class="brr"></div>
</div>

CSS

.gallery {
    background:red;
    width:30%;
    margin:auto;
    border:1px solid blue;
}
.pic {
    float:left;
    width:30px;
    height:30px;
    background:yellow;
    margin:3px;
    clear:none;
}
.brr {
    clear:both;
    height:2px;
}