JSFiddle - React, Tailwind, and code Playground

by Gwyn Milcote

HTML

<div class='blue'>
This box has a blue border.
</div>

<p>
<div class='yellow'>
This box has a hideous yellow background.
</div>
</p>

<div class='blue yellow'>
This div has both of those classes. You can mix and match!
</div>

<p>
<div class='round padded blue'>
This div has blue border, and rounded border, and padding around the edges.
</div>
</p>

Try editing these classes and making more divs with class combos.

CSS

.blue {border:2px solid blue;}
.yellow {background-color:yellow;}

.round {border-radius:10px;}

.padded {padding:20px;}