JSFiddle - React, Tailwind, and code Playground

HTML

<div class="wrap">
         <span></span>
         <span></span>
         <span></span>
         <span></span>
         <span></span>
         <span></span>
     </div>

CSS

.wrap{
width:270px;
margin:0 auto;
padding:10px 30px;
background:blue;
}

span{
margin:5px 0px;
border:1px solid red;
background:#fff;
min-height:30px;
}

span:nth-child(-n+3){
display:block;
}

span:nth-child(4), span:nth-child(5){
display:inline-block;
width:130px;
}

span:nth-child(6){
display:block;
width:70px;
margin:0 auto;
}