JSFiddle - React, Tailwind, and code Playground

by Boris Šuška

HTML

<div class="yellow">
    <div class="outer">
        <div class="red"></div>
        <div class="blue"></div>
    </div>
</div>

CSS

.outer {
    position: relative;
    float: left;
	padding: 50px;
    background: green;
}
.red {
    position: relative;
    top: 50px;
    width: 100px;
	height: 100px;
	background: red;	
}
.blue {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
	height: 100px;
	background: blue;
}
.yellow {
    background: yellow;
}