JSFiddle - React, Tailwind, and code Playground

HTML

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Playground</title>
</head>
<body>
	<section id="content">
    <div>Cats</div>
    <div>Dogs</div>
    <div>Tigers</div>
    <div>Tortoises</div>
    <div>Ducks</div>
    <div>Pumas</div>
    <div>Hyenas</div>
    <div>Pigs</div>
    <div>Cows</div>
    <div>Foxes</div>
    <div>Wolfs</div>
    <div>Bison</div>
  </section>
</body>
</html>

CSS

section#content {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content:space-around;
}

section#content div {
  padding: 10px;
  margin: 4px;
  border: 1px solid black;
  width: 100px;
  height: 40px;
}