JSFiddle - React, Tailwind, and code Playground
by Lena R
HTML
<div class = "stick"></div><div class = "stick-2"></div>
CSS
.stick {
width: 10px;
height: 200px;
background: #5E1B1B;
border-radius: 10px;
float: left;
animation: slidein 10s steps(20) infinite;
animation-name: slidein;
}
.stick-2 {
width: 50px;
height: 10px;
background: #5E1B1B;
border-radius: 10px;
animation: slidein 10s steps(20) infinite;
animation-name: slidein;
}
@keyframes slidein {
from {
margin-left: 0%;
}
to {
margin-left: 90%;
}
}