gbQdGm.markdown

gbQdGm

A Pen by Captain Anonymous on CodePen.

License.

index.html

<ul>
  <li class="big"></li>
  <li class="yellow"></li>
  <li></li>
  <li></li>
  <li class="yellow"></li>
</ul>

style.css

ul {
  margin: 0;
  padding: 0;
}

ul:before, ul:after {
  content: " ";
  display: table;
}

li {
  float: left;
  width: 25%;
  padding-bottom: 25%;
  list-style: none;
  background: blue;
}
li.yellow {
  background: yellow;
}

li.big {
  width: 50%;
  padding-bottom: 50%;
}