JSFiddle - React, Tailwind, and code Playground
HTML
<body>
<div class="blocks">
<div class="block"></div>
<div class="block"></div>
<div class="block"></div>
<div class="block"></div>
</div>
<div class="blocks">
<div class="block"></div>
<div class="block"></div>
<div class="block"></div>
<div class="block"></div>
</div>
<div class="blocks">
<div class="block"></div>
<div class="block"></div>
<div class="block"></div>
<div class="block"></div>
</div>
<div class="blocks">
<div class="block"></div>
<div class="block"></div>
<div class="block"></div>
<div class="block"></div>
</div>
</body>
CSS
.blocks {
width:100%;
height:100px;
}
.block{
float: left;
overflow: hidden;
margin: 2%;
width: 20%;
height: 100%;
background-image: url(http://www.designmyprofile.com/images/graphics/backgrounds/background0172.jpg);
background-repeat: no-repeat;
background-position: left top;
background-attachment: fixed;
}
/*
html { background: url(http://www.designmyprofile.com/images/graphics/backgrounds/background0172.jpg) no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;}
*/