JSFiddle - React, Tailwind, and code Playground

HTML

<div id='container_marquee'>
         <marquee id='mymarquee' behavior="scroll" onmouseover="this.stop();" onmouseout="this.start();">
                   <span class='span1'>first marquee text</span>
                   <span class='span2'>second marquee text</span>
                   <span class='span3'>third marquee text</span>
                   <span class='span4'>fourth marquee text</span>
                   <span class='span5'>fifth marquee text</span>
         </marquee>
        </div>

CSS

div{
  width:400px;
  border:1px solid red;
}

.span1{
  background:yellow;
}