Как сделать, чтобы анимация шла не переставая?
У меня появился вопрос. Как сделать анимацию, чтобы блоки двигались друг за другом. То есть за последним блоком должен двигаться первый.
<style>
body { overflow-x: hidden; margin: 0; }
.element {
display: flex;
justify-content:space-between ;
height: 70px;
width: 100%;
border-radius: 15px;
margin-top: 10px;
animation: nudge 10s linear infinite;
}
.element1 {
display: flex;
height: 70px;
width: 100px;
margin-right: 10px;
border-radius: 15px;
margin-top: 10px;
background-color: red;
}
@keyframes nudge {
0% { transform: translatex(-100%); }
100% { transform: translatex(100vw); }
}
</style><div class="element">
<div class="element1">1</div>
<div class="element1">2</div>
<div class="element1">3</div>
<div class="element1">4</div>
<div class="element1">5</div>
</div>