JSFiddle - React, Tailwind, and code Playground

by Ethan Hammond

HTML

<div class="top">
      <div class="second">
          <div class="last">
              <div class="square"></div>
              <div class="square"></div>
              <div class="square"></div>
          </div>
    </div>
</div>

CSS

body {
    height: 1000px;
    width: 500px;
}
.top {
    border: solid 1px black;
    width: 100%;
    height: 100%;
    background: grey;
}
.second {
    width: 84%;
    height: 100%;
    margin-left: auto;
    margin-left: auto;
}
.last {
    margin-right: auto;
    margin-left: auto;
}
.square {
    display: inline-block;
    margin: 2%;
    width: 150px;
    height: 150px;
    border: 1px solid white;
    background: purple;
}