JSFiddle - React, Tailwind, and code Playground

HTML

<div id="container">
</div>

CSS

#container {
  background-color: #789;
  display: grid;
  grid-template-columns: 25% 25% 25% 25%;
  grid-template-rows: 25% 25% 25% 25%;
  width: 200px;
  height: 200px;
  padding: 2px;
}

#container button {
  margin: 2px;
}

JavaScript

let container = document.getElementById("container");
for (let i=1; i<=16; i++) {
	let butt = document.createElement("button");
  butt.innerHTML = i;
  container.appendChild(butt);
}