Flex grid

flex-grid.html

<div class="grid">
  <div class="grid__row">
    <div class="grid__item">
      <div class="item">
        <p>Hello</p>
        <a href="#">Click</a>
      </div>
    </div>
    <div class="grid__item">
      <div class="item">
        <p>Hello</p>
        <a href="#">Click</a>
      </div>
    </div>
  </div>
  <div class="grid__row">
    <div class="grid__item">1</div>
    <div class="grid__item">2</div>
    <div class="grid__item">3</div>
  </div>
  <div class="grid__row">
    <div class="grid__item">1</div>
    <div class="grid__item">2</div>
    <div class="grid__item">3</div>
    <div class="grid__item">4</div>
  </div>
</div>

flex-grid.scss

body {
  padding: 80px;
}
.grid {
  border: solid 1px #e7e7e7;
}

.grid__row {
  display: flex;
}

.grid__item {
  flex: 1;
  padding: 12px;
  border: solid 1px #e7e7e7;
}

.item {
  max-width: 200px;
  display: flex;
  
}