<div class="container">
  <div class="header">
    this is header
  </div>
  <div class="sidebar">
    this is sidebar
  </div>
  <div class="content">
    this is content
  </div>
  <div class="footer">
    this is footer
  </div>
</div>

.container {
  display: grid;
  max-width: 800px;
  margin: auto;
  grid-template-columns: 1fr 4fr;
  grid-gap: 5px;
}

.header {
  background: lightblue;
  height: 50px;
  grid-column: 1/3;
}

.sidebar {
  background: pink;
  height: 300px;
}

.content {
  background: lightgray; 
}

.footer {
  background: yellow;
  grid-column: 1/3;
  height: 40px;
}