1
2<div class="scroll-container">
3  <div class="scroll-content">
4        <img src="https://via.placeholder.com/150x50?text=Logo+1" alt="Logo" class="scroll-item" />
5    <img src="https://via.placeholder.com/150x50?text=Logo+2" alt="Logo" class="scroll-item" />
6    <img src="https://via.placeholder.com/150x50?text=Logo+3" alt="Logo" class="scroll-item" />
7    <img src="https://via.placeholder.com/150x50?text=Logo+4" alt="Logo" class="scroll-item" />
8    <img src="https://via.placeholder.com/150x50?text=Logo+5" alt="Logo" class="scroll-item" />
9        <img src="https://via.placeholder.com/150x50?text=Logo+1" alt="Logo" class="scroll-item" />
10    <img src="https://via.placeholder.com/150x50?text=Logo+2" alt="Logo" class="scroll-item" />
11    <img src="https://via.placeholder.com/150x50?text=Logo+3" alt="Logo" class="scroll-item" />
12    <img src="https://via.placeholder.com/150x50?text=Logo+4" alt="Logo" class="scroll-item" />
13    <img src="https://via.placeholder.com/150x50?text=Logo+5" alt="Logo" class="scroll-item" />
14  </div>
15</div>
16

1
2.scroll-container {
3  height: 100px;
4  background: #ffffff;
5  overflow: hidden;
6  position: relative;
7}
8
9.scroll-content {
10  display: flex;
11  position: absolute;
12  animation: scroll 42.5s linear infinite;
13  animation-direction: normal;
14}
15
16.scroll-item {
17  flex: 0 0 150px;
18  height: 50px;
19  margin-right: 20px;
20}
21
22@keyframes scroll {
23  0% {
24    transform: translateX(0);
25  }
26  100% {
27    transform: translateX(-850px);
28  }
29}
30