JSFiddle - React, Tailwind, and code Playground

by surjithctly

HTML

<div id="wrapper">
    
    
     
    <div id="page">
    
    Foreground content
</div>
  

    
    
    
    <div id="content">
    

</div>


</div>

CSS

@-webkit-keyframes MOVE-BG {
    from { left: 0; }
    to { left: -2000px; }
}

#wrapper {
    position:relative;
    width:800px;
	height: 300px;
    overflow:hidden;
}

#page {
    text-align: center;
    font-size: 26px;
    color: #000;
}

#content {
	width: 2000px;
	height: 300px;
	background: url(http://www.gstatic.com/webp/gallery/1.jpg) 0% 0% repeat;
	position:absolute;
    top: 0;
    left: 0;
    z-index:-1;
	-webkit-animation-name: MOVE-BG;
	-webkit-animation-duration: 100s;
	-webkit-animation-timing-function: linear;
	-webkit-animation-iteration-count: infinite;
}