JSFiddle - React, Tailwind, and code Playground

by Alexey Lisovy

HTML

<div>
  <div class="d1"></div>
  <div class="blabla"></div>
  <div class="d1"></div>
  <div class="d1"></div>
  <div class="d1"></div>
  <div class="d1"></div>
  <div class="d1"></div>
  <div class="d1"></div>
  <div class="d1"></div>
  <div class="d1"></div>
  <div class="d1"></div>
  <div class="blabla"></div>
  <div class="blabla"></div>
  <div class="d1"></div>
  <div class="d1"></div>
  <div class="d1"></div>
  <div class="d1"></div>
  <div class="d1"></div>
  <div class="d1"></div>
</div>

CSS

html {
  background: #fff;
  font-family: sans-serif;
}
div div {
  background: #eee;
  width: 50px;
  height: 50px;
  margin: 3px;
}
.blabla
  {
  background: #088;    
  }
.d1:nth-of-type(2n) {
  float: right;
  background: #880;
}