div {
width: 230px;
height: 120px;
background: red;
position: relative;
overflow: hidden;
}
div:after {
content:"";
width: 260px;
height: 50px;
background: #fff;
border-radius: 100% 100% 0 0;
position: absolute;
bottom:0;
left: -15px;
}<div></div>I have a version of this in react I trying put text the red archway space I don't know how to go about it. if I should make a div use position or nested in the div:after