JSFiddle - React, Tailwind, and code Playground

by SerGen

HTML

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

CSS

#a,
#b {
	width: 60%;
	height: 50vh;
	background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADMAAAAzCAYAAAA6oTAqAAAAX0lEQVRoge3QsQkAMAwEMe+/dLJDCnMECVw/55kFZ+Zs7KwQUyWmSkyVmCoxVWKqxFSJqRJTJaZKTJWY16Ffbu1hK0MbxFSJqRJTJaZKTJWYKjFVYqrEVImpElMl5sEFz8fJNwIHW5kAAAAASUVORK5CYII=);
	background-color: lightyellow;
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-position: 50% 50%;
	position: absolute;
	top: 0;
	z-index: 100;
	animation: left 1s linear infinite alternate;
}

#b {
	top: 50vh;
	will-change: left;
}

@keyframes left {
	0% {
		left: 0;
	}
	100% {
		left: 100px;
	}
}