Angular гибкий макет для главной веб-страницы - невозможно получить основной, чтобы заполнить вертикальное пространство между верхним и нижним колонтитулом - PullRequest
Новая
       17

Angular гибкий макет для главной веб-страницы - невозможно получить основной, чтобы заполнить вертикальное пространство между верхним и нижним колонтитулом

0 голосов
/ 29 февраля 2020

Новый ie Angular8 / Flex вопрос ...

Я пытаюсь настроить макет веб-страницы Святого Грааля с обычным верхним, основным и нижним колонтитулами, вертикально выровненными панелями, используя CSS как показано ниже ... 

body {
  display:flex;
  flex-direction:column;
  min-height:100vh;
  background: brown;
}

.appMain {
  display:flex;
  flex-direction:column;
  min-height:100vh;
  background: chartreuse;
  justify-content: space-between;
}

header {
  background:aqua;
  min-height: auto;
  height: auto
}


main {
  flex: 1;
  display: flex;
  background: cadetblue;
}

footer {
  background:crimson;
  height: auto;
  min-height: auto;
}

... но главная панель не заполняет доступное вертикальное пространство

enter image description here

Что CSS мне нужно, чтобы основная панель заполняла вертикальное пространство между панелями верхнего и нижнего колонтитула?

...