JSFiddle - React, Tailwind, and code Playground

by vend3tta

HTML

<ul>
    <li><input type="checkbox" id="c1" /><label for="c1"> Checkbox 1</label></li>
    <li><input type="checkbox" id="c2" /><label for="c2"> Checkbox 2</label></li>
    <li><input type="checkbox" id="c3" /><label for="c3"> Checkbox 3</label></li>
    <li><input type="checkbox" id="c4" /><label for="c4"> Checkbox 4</label></li>
    <li><input type="checkbox" id="c5" /><label for="c5"> Checkbox 5</label></li>
    <li><input type="checkbox" id="c6" /><label for="c6"> Checkbox 6</label></li>
</ul>

CSS

ul {
    margin: 20px;
    padding: 20px;
    border: 1px solid #000;
    border-radius: 4px
    }
li {
    margin: 4px 0
    }
input {
    width: 16px;
    height: 16px;
    display: inline-block;
    margin: 0 10px 0 0;
    padding: 0;
    border: 1px solid #aaa;
    border-radius: 2px;
    background: #fff
    }
label {
    display: inline-block
    }