Как создать шатер бесконечную петлю слайдера логотипов только с CSS ⇐ Html

[Anonymous]

Прямо сейчас мой код заставляет логотипы оживлять справа налево, и как только он достигнет конца, он перезагружается. Как я могу продолжить в цикле, чтобы первый логотип следует последнему, когда начинается новый цикл? Class = "Snippet-Code">

Код: Выделить всё

img {
width: 100px;
}
.marquee {
position: relative;
width: 100%;
height: 100px;
border: 1px solid black;
overflow: hidden;
}
.marquee div {
display: block;
position: absolute;
width: 300%;
overflow: hidden;
animation: marquee 20s linear infinite;
}
.marquee div:hover {
animation-play-state: paused;
}
.marquee span {
float: left;
width: 50%;
}

@keyframes marquee {
0% { left: 0; }
100% { left: -100%; }
}< /code>


[img]http://static.bragdeal.com/logo.png[/img]
[img]http://static.bragdeal.com/logo.png[/img]
[img]http://static.bragdeal.com/logo.png[/img]
[img]http://static.bragdeal.com/logo.png[/img]
[img]http://static.bragdeal.com/logo.png[/img]
[img]http://static.bragdeal.com/logo.png[/img]
[img]http://static.bragdeal.com/logo.png[/img]
[img]http://static.bragdeal.com/logo.png[/img]

Подробнее здесь: https://stackoverflow.com/questions/386 ... h-css-only