JSFiddle - React, Tailwind, and code Playground

HTML

<div class="d1">
    <div class="d5">d5</div>
    <div class="d2">d2</div>
    <div class="d3">d3</div>
    <div class="d4">d4</div>

</div>

CSS

.d1{
    border: 1px solid red;
}
.d2{
    border: 1px solid green;
    float: left;
    width: 50px
}
.d3{
    border: 1px solid yellow;
    float: left;
    width: 50px;
}
.d4{
    border: 1px solid blue;
    margin-left: 104px;
    margin-right: 51px;
}
.d5{
    border: 1px solid gray;
    float: right;
    width: 51px;
}