JSFiddle - React, Tailwind, and code Playground

HTML

<div class="container">еуые</div>

CSS

body {overflow:hidden;}

.container {
  margin: 0 auto;
  width: 200px;
  height: 100px;
  background:red no-repeat center center;
  background-size: cover;
  animation: con 8s infinite linear;
  -webkit-animation:con 8s infinite linear;
}

@keyframes con
{
0% {width: 200px; height: 100px;}
25% {width: 200px; height: 600px;}
50% {width: 1200px; height: 600px;}
75% {width: 200px; height: 600px;}
100% {width: 200px; height: 100px;}
}

@-webkit-keyframes con
{
0% {width: 200px; height: 100px;}
25% {width: 200px; height: 600px;}
50% {width: 1200px; height: 600px;}
75% {width: 200px; height: 600px;}
100% {width: 200px; height: 100px;}
}