Answers for "display flex elements in rows but gap between divs in css"

css flex gap between items

/* limited support (Q1/2021: Firefox, Chrome, Safari) */
.flex-container
{
  display: flex;
  gap: 5px;
}

/* broad support */
.flex-item
{
  margin: 5px;
  /* and/or */
  padding: 5px;
}

flex items with space between the lines

.flex-container {
  
  display: flex;
  
  justify-content: space-between;
}