Боков Глеб

Благодарю Вас за ответ! У Вас получилось решить задачу. Ещё пока не до конца понял, за счёт чего именно, но применю это к своему реальному проекту.

Цитата

До сих пор понять не могу, как у вас шапка залеплена

Залеплена она очень просто: она является первым элементов flex-контейнера с ориентацией column. Контейнер при этом имеет высоту 100vh, а второй его дочерний элемент занимает между между шапкой и низом экрана. Такой подход позволяет не указывать абсолютную высоту шапки.

Цитата

это делается банальным position:fixed;

А можно залепить шапку с помощью fixed без указания её абсолютной высоты? Если нет, то решение с fixed не подходит.

Цитата

На caniuse не проверяли ваши изыски с проблемами совместимости?

Так причина же не ясна. Отсюда непонятно, как искать.

Цитата

За километровые классы отдельное спасибо))

Между краткостью и однозначностью я выбираю второе (и то и другое возможно не всегда).

Компоновка: типичный блок .Wrapper, который имеет ширину 100% от ширины окна, и центровщик (margin: 0 auto;) с указанными min-width и max-width:

В IE следующий баг: Wrapper почему-то заканчивается раньше, чем надо, а центровщик с содержимым перекрывает следующую такую же компоновку ниже:

Такой баг был замечен уже практически на свёрстанном лендинге, а потому было очень трудно сделать минимальный работающий пример. Я постарался убрать весь лишний HTML для данного примера, но CSS тоже самое было сделать очень трудно.

Если Вы запустите пример в IE (ещё раз повторюсь, что в других браузерах всё нормально), то увидите следующее:

На StackOverflow уже несколько недель никто не может найти решение (оно и понятно: в разметке-то ошибок нет, это просто баг IE, но с ним надо что-то делать, потому что пользователи IE, увы, ещё превышают критическую отметку 10%). Вот только что удалось выяснить: если контейнеру .FlexPageLayoutWithFixedHeaderAndBottomFooter-Wrapper для основного содержимого (под header) задать min-height вместо height, то отображение станет нормальным. К сожалению, такое решение не годится потому, что исчезнет "прилипание" header-а кверху. Можно, конечно, прилепить его и другими способами, но хотелось бы избежать задания его абсолютной высоты, так как это противоречит концепции адаптивной вёрстки.