/* (A) FORCE ALL ITEMS INTO SINGLE ROW */ /* (A) FORCE ALL ITEMS INTO SINGLE ROW */ .hmove { display: flex; } .hitem { width: 100%; flex-shrink: 0; } .hwrap { overflow: hidden; direction:rtl; position:fixed; left:0; bottom:0; z-index:23; background:#ff00007f; width:100vw; font-size: 250%; } /* (B) MOVE ITEMS FROM RIGHT TO LEFT */ /* first item = 0, fourth item = -300% */ @keyframes tickerh { 0% { transform: translatex(-100%); } 100% { transform: translatex(400%); } } .hmove { animation: tickerh linear 40s infinite; } /* .hmove:hover { animation-play-state: paused; } */