JSFiddle - React, Tailwind, and code Playground

by Chris Ball

HTML

<div class="fixed">
	<div class="child"></div>
</div>

CSS

* {
	margin: 0;
}

.fixed {
	background: #ddd;
	bottom: 1rem;
	left: 1rem;
	position: fixed;
	top: 1rem;
	width: calc(100% - 2rem);
}

.child {
	background: red;
	bottom: 1rem;
	left: 1rem;
	position: absolute;
	right: 1rem;
	transform: translateY(0rem);
	top: 1rem;
}