JSFiddle - React, Tailwind, and code Playground

HTML

<div id="clipcorners">
<span id="a">
</span>
<span id="b">
</span>
</div>

CSS

body {
    background:blue;
}
div#clipcorners {
    width:500px;
    height:200px;
    background:red;
    position:relative;
    margin:100px auto;
}
span#a,span#b {
    position:absolute;
    width:10px;
    height:180px;
    top:10px;
    background:red;
}
span#a {
    left:-10px;
}
span#b {
    right:-10px;
}