CSS Tutorial

CSS Flexbox

<!DOCTYPE html>
<title>Example</title>
<style>
.outer-container {
  font: 16px sans-serif;
  background: gold;
  color: white;
  height: 200px;
  display: flex;
}
.box {
  padding: 10px;
  flex: 1 0 auto;
}
.larger {
  background: yellowgreen;
  flex: 3 0 auto;
}
</style>
<div class="outer-container">
  <div class="box">Box</div>
  <div class="box larger">Larger Box</div>
  <div class="box">Box</div>
  <div class="box larger">Larger Box</div>
</div>