Elements not being displayed for flexbox

Question

I'm trying to create a 2 column layout with a fixed width on the left and a flexible right column that fills the remainder of the screen. The columns are not being display.

.container {
  display: flex;
  width: 100%;
  height: 100%;
}

.left-column {
  flex: 0 0 200px;
  height: 100%;
  background: lightcoral;
}

.right-column {
  flex-grow: 1;
  background: lightgreen;
}

https://stackblitz.com/edit/2-column-fixed-flex

Answer 1

You need to assign height and flex-direction:row; and for a fixed width, left-column supposed to have a width as well.

.container {
  display: flex;
  width: 100%;
  height: 100vh;
}