JSFiddle - React, Tailwind, and code Playground

HTML

<div class="a">

        </div>
        <div class="b">
            <div class="overlap" ></div>
            <p >
                Lorem Ipsum, arula jkasds 
            </p>
        </div>

CSS

.a{  
position: relative;
  width: 100%;
  background-color: #005a73;
    height: 100px;

}

.overlap {
    width: 50px;
    height: 80px;
    position: absolute;
    background: yellow;
    top: -90px;
    left: 20px;
}

.b{
  /*  overflow: auto; */
   position: relative;
  width: 100%;
  height: 840px;
  background-color: #f7f7f7; 
}

p{
    margin-top: 50px;
}