JSFiddle - React, Tailwind, and code Playground

HTML

<div class="marquee-rtl">
  <div>Texte défilant horizontalement</div>
</div>

CSS

.marquee-rtl {
  /* width: 100%; /* A ADAPTER */
}
.marquee-rtl > div {
  width: 100%;
  display: inline-block; /* important */
  white-space: nowrap; /* important */
  animation: defilement-rtl 4s infinite linear; /* défilement */
  cursor: pointer;
}
.marquee-rtl:hover > div {
  animation-play-state: paused; /* met en pause le défilement */
}
@keyframes defilement-rtl {
  0% {
    -webkit-transform: translate(100%);
    transform: translate(100%);
  }
  100% {
    -webkit-transform: translate(-100%);
    transform: translate(-100%);
  }
}