<div class="container">
  <div class="wrapper">
    <div class="mid"></div>
  </div>
  <div class="left"></div>
  <div class="right"></div>
</div>
html, body {height: 100%;}
.container {min-width: 200px; height: 100%;}
.wrapper {float: left; width: 100%; height: 100%;}
.mid {height: 100%; margin-left: 80px; margin-right: 120px; background-color: yellow;}
.left, .right {float: left;}
.left {width: 80px; height: 200px; margin-left: -100%; background-color: #4688f5;}
.right {width: 120px; height: 100px; margin-left: -120px; background-color: tomato;}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.