Я пытаюсь заполнить вертикальное пространство гибкого элемента внутри flexbox.

.container {
  height: 200px;
  width: 500px;
  display: flex;
  flex-direction: row;
}
.flex-1 {
  width: 100px;
  background-color: blue;
}
.flex-2 {
  position: relative;
  flex: 1;
  background-color: red;
}
.flex-2-child {
  height: 100%;
  width: 100%;
  background-color: green;
}

И здесь'сJSFiddle

flex-2-child Безразлично»Заполните необходимую высоту, за исключением двух случаев, когда:

flex-2 имеет высоту 100% (что странно, потому что гибкий элемент по умолчанию имеет 100% + он глючит в Chrome)flex-2-child имеет абсолютную позицию, что также неудобно

Это нев настоящее время не работает в Chrome или Firefox.