<div class="marquee">  <div class="marquee__inner">    <span>Bu metin kayar</span>  </div> </div>

.marquee {  width: 100%;  overflow: hidden;  background-color: #f7f7f7; } .marquee__inner {  display: inline-block;  white-space: nowrap;  padding-left: 100%;  animation: marquee 10s linear infinite; } .marquee__inner span {  display: inline-block;  padding-right: 1rem; } @keyframes marquee {  0% {    transform: translate(0, 0);  }  100% {    transform: translate(-100%, 0);  } }