body {
  background:beige;
}
.wrapper {
  max-width:1000px;
  margin: 0 auto;
  background:#fff;
  display: grid;
  /* grid-template-areas:
  "header header header header"
  "gauche gauche . droite"
  "footer footer footer footer"
  ; */
  grid-template-columns:1fr 1fr 1fr;
  /* gap:10px; */
  /* grid-template-rows:100px 50px; */
}
.wrapper div {
  color:#fff;
}
header {
  background:rebeccapurple;
}
.wrapper div:nth-of-type(1) {
  background:crimson;
}
.wrapper div:nth-of-type(2) {
  background:yellowgreen;
}
footer {
  background:tomato;
  order:-1;
}