React - remove space between components inside flexbox

How to remove space between components inside the flexbox in ReactJS?

I specified flexbox with flex-wrap and the components align well when there are too many of them, but they are spread over the entire surface of the flexbox, and I wish there was one row right below the other.

How to achieve such an effect?

flexbox CSS file:

.taskBoard {
  display: flex;
  flex-wrap: wrap;
  padding: 10px 0px 0px 20px;
  position: fixed;
  top: 85px;
  left: 338px;
  right: 15px;
  bottom: 15px;
  background: white;
  border-radius: 10px;
  box-shadow: 10px 10px 10px #dcdcdc;
  border: 1px solid #f0efef;
}

Example: