stackoverflow stuff

by Derek Wood

HTML

<div class="map">
  map
</div>

<div class="sub-title">
  sub-title
</div>

<div class="other-stuff">
  other-stuff
</div>

<div class="button">
  button
</div>

CSS

html {
  height: 100%;
}

body {
  display: flex;
  flex-direction: column;
  height: 100%;
}

div {
  padding: 1rem;
}

.map {
  background: gray;
  flex-grow: 1;
}

.sub-title {
  background: lightgreen;
}

.other-stuff {
  background: white;
  flex-basis: 100px;
}

.button {
  background: lightgray;
}