JSFiddle - React, Tailwind, and code Playground

HTML

<div class="box">
    <div class="normal">normal</div>
</div>
<div class="box">
    <div class="padding">padding</div>
</div>
<div class="box">
    <div class="margin">margin</div>    
</div>

CSS

.box {
    width:200px;
    height:200px;
    background-color: rgb(247, 107, 107);
    float:left;
    border : 1px solid black;
}
.padding{
    width:100px;
    height:100px;
    padding : 50px;
    background-color:whitesmoke;
    border : 1px solid black;
}
.margin{
    width:100px;
    height:100px;
    margin : 50px;
    background-color:whitesmoke;
    border : 1px solid black;
}

.normal{
    width:100px;
    height:100px;
    background-color:whitesmoke;
    border : 1px solid black;
}