При открытии через Edge все работает как надо, т.е. шапка прижата к верху, футер прижат к низу и контент находится по центру. Если контент влезает в экран то он выравнивается по центру по вертикали, если контента много и он не влезает то должна появляться прокрутка, при этом задний фон должен растягиваться на всю высоту сайта.
Вот пример:
https://jsfiddle.net/moook/wvdqp1bw/
Проблема заключается в том что в некоторых браузерах к примеру IE 11, данный код не работает без указания высоты родительских блоков, а при указании 100% высоты, родительский блок не заполняет всю высоту, если контент не влезает в экран.
Долго искал решение, так и не нашел как это можно реализовать через CSS
Варианты через jquery просьба не предлагать, так как знаю как решить вопрос через него, принципиально выяснить можно ли так сделать через css)
Простой
Средний
