height:100%;

      display:grid; 

      grid-template-columns: repeat(12,1fr); 

      grid-template-rows: 40px 200px 40px;      

      grid-gap: 3px;

      grid-template-areas:

        ". h h h h h h h h m m ."

        "c c c c c c c c c c c c"

        ". f f f f f f f f f f .";

      }

.header{

  background-color: pink;

  text-align: center;

  grid-area: h;

}

​

.menu{

  color:white; 

  text-align: center;

  background-color: blue;

  grid-area: m;

}

​

.content{

  text-align: center;

  background-color: yellow;

  grid-area: c;

}

​

.footer{

  color:white;

  text-align: center;

  background-color: green; 

  grid-area: f;

}