JSFiddle - React, Tailwind, and code Playground

HTML

<div class="container">
    <div class="item item1">1</div>
    <div class="item item2">2</div>
    <div class="item item3">3</div>
</div>

CSS

.container {
   background-color: #FF5722;
   height: 100vh;
   width: 100%;
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: center;
}
 
.item {
   background-color: #0000ff;
   color: #fff;
   padding: 10px;
}

.item1{
   height: 100px;
   width: 100px;
}

.item2{
   height: 50px;
   width: 150px;
}

.item3{
   height: 100px;
   width: 200px;
}