JSFiddle - React, Tailwind, and code Playground

HTML

<div id="main">
  <div id="box1">box1</div>
  <div id="box2">box2</div>
</div>

CSS

#main {
  display: flex;
  flex: 1;
  flex-direction: column;
  justify-content: center;
  height: 100px;
  background-color: #dfdfdf;
  position: relative;
}

#box1 {
  display: flex;
  justify-content: flex-end;
  background-color: #ff0000;
  position:absolute;
  top:0;
  width:100%;
}

#box2 {
  display: flex;
  background-color: #00ff00;
}