cssbattle

cssbattle.html

<div class="grid g"></div>
<div class=""></div>
<style>
  body {
    background: #6592CF;
  }

    .grid {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 400px;
    height: 300px;
    background-size: 20px 20px;
    background-image:
    linear-gradient(to right, white 1px, transparent 1px),
    linear-gradient(to bottom, white 1px, transparent 1px);
  }
  .g1{background-size: 10px 10px;}
  .g2{background-size: 25px 25px;}
  .a {
    position: absolute
  }
  .c {
      transform: translate(-50%, -50%);
  }
  .cx {
      transform: translateX(-50%);
  }
  .cy {
      transform: translatey(-50%);
  }
</style>