<div class="wrapper">

  <header></header>
  <div class="container">
    <aside></aside>
    <main></main>
    <aside></aside>
  </div>
  <footer></footer>

</div>

.wrapper {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}
header,
footer {
  background: #4F4E8A;
  width: 100%;
  height: 50px;
}
.container {
  flex-grow: 1;
  display: flex;
  width: 100%;
}
aside{
  width: 200px;
  background: #9f636b;
}
main {
  flex-grow: 1;
  background: #9f636b;
  margin: 0 5px;
}