CodePen

HTML

            
              <ul>
  <li>1</li>
  <li>2</li>
  <li>3</li>
  <li>4</li>
  <li>5</li>
  <li>6</li>
</ul>
            
          
!

CSS

            
              li {
  width: 100px;
  height: 100px;
  background:
    linear-gradient(
      rgba(255,0,0,0.4),
      rgba(255,0,0,0.4)
    ),
    url(http://placekitten.com/g/100/100);
  color: white;
  text-align: center;
  font-size: 50px;
  line-height: 100px;
  font-weight: bold;
  border: 1px solid white;
}
li:nth-child(4){
  margin-top:-306px;
}
li:nth-child(n+4){
  margin-left:102px;
}
            
          
!
? ?
? ?
Must be a valid URL.
+ add another resource
via CSS Lint

JS

            
              
            
          
!
Must be a valid URL.
+ add another resource
via JS Hint
Loading ..................