<div id="container"></div
#container {
  height:100vh;
  display:flex;
  align-content: center;
  justify-content: center;
  flex-wrap:wrap;
  gap: 1rem;
}

.div-style {
   display:flex;
  align-content: center;
  justify-content: center;
  flex-wrap:wrap;
  height: 100px;
  width: 100px;
  background-color: blue;
  color: white;
  font-size:1.2rem;
}
const container = document.getElementById("container")

const wordList = ["here", "is", "a", "list", "of", "words"]

function mapFunction (item) {
  const div = document.createElement("div")
  div.classList.add("div-style")
  div.innerHTML = item
  container.appendChild(div)
}

wordList.map(mapFunction)

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.