<div class="marquee">
  <div>A Million Reasons To Love Web Development</div>
</div>

body {
  height: 100vh;
  display: flex;
  justify-content: center;
  align-items: center;
}

.marquee {
  width: 80%;
  background: violet;
  text-transform: uppercase;
  white-space: nowrap;
  overflow: hidden;
}

.marquee div {
  font-size: 5rem;
  font-family: verdana;
  padding-left: 100%;
  display: inline-block;
  animation: animate 10s linear infinite;
}

@keyframes animate {
  100% {
    transform: translate(-100%, 0);
  }
}