.container {
  width: 200px; /* Задаем ширину контейнера */
  overflow: hidden; /* Скрываем переполнение */
  text-align: center; /* Центрируем текст */
  white-space: nowrap; /* Запрещаем перенос текста */
}

.text-container {
  display: inline-block; /* Или 'inline-flex' для более сложных случаев */
  animation: moveText 10s linear infinite; /* Добавляем анимацию */
}

.moving-text {
  display: inline-block; /*  Важно для корректной работы анимации */
  max-width: 100%; /*  Ограничиваем ширину текста */
  overflow: hidden; /*  Скрываем переполнение */
  text-overflow: ellipsis; /*  Добавляем многоточие */
}

@keyframes moveText {
  0% {
    transform: translateX(100%); /* Начинаем анимацию справа */
  }
  100% {
    transform: translateX(-100%); /* Заканчиваем анимацию слева */
  }
}