<div class="parent">
  <div class="child">1</div>
  <div class="child">2</div>
  <div class="child">3</div>
</div>
.parent {
  display: flex;
  flex-wrap: wrap;
}

.child {
  //  flex: none | [ <'flex-grow'> <'flex-shrink'>? || <'flex-basis'> ]
  //  If we don't want the items to stretch:
  flex: 0 1 300px;
  //  If we do want the items to stretch:
  flex: 1 1 300px;
  
  //   etc.
  border: 1px solid red;
  background: lightpink;
  font-size: 2rem;
  text-align: center;
}

body {
  font-family: system-ui, serif;
}
View Compiled

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.