Как выровнять блок по вертикальному центру независимо от размера экрана?

Question

[ligisayan]

Есть блок headings который хочу размещать по вертикальному центру экрана независимо от размеров экрана и кроссбраузерности ie8+ (flexbox не пойдет), причем с header и footer прибитыми сверху и снизу соответственно. Сейчас отображается нормально для средних экранов, но на больших - блок подброшен вверх.Как это можно сделать? фидл

Comments

[Александр Булгаков]

position не катит?

[ligisayan]

Александр Булгаков если это решит проблему, то катит - я пока не вижу решения, как можно сделать для любого экрана. body {height:100%; display:table;} ?

Answer 1

[Pavel Torbeev]

Для Ие11+ Отлично работает вариант

.headings {position:absolute; top: 50%; transform: translateY(-50%)}

Если известна высота headings, то везде работает вариант

.headings {position:absolute; top: 50%; margin-top: - blockheight/2}

Comments

[ligisayan]

Pavel Torbeev я вас правильно понимаю, что имеете ввиду вот так?
https://jsfiddle.net/xdkrxtn1/2/
но это не то, что мне нужно..

[Pavel Torbeev]

Я имею ввиду вот так. https://jsfiddle.net/xdkrxtn1/4/ Только футтер еще к низу нужно присобачить

[ligisayan]

Pavel Torbeev: ага, спасибо - похоже окончательный вариант такой - https://jsfiddle.net/xdkrxtn1/5/

Answer 2

[Александр Булгаков]

Попробуй

Comments

[Александр Булгаков]

и здесь почитай может найдешь решение

[ligisayan]

я правильно понимаю, что имеете ввиду вот так
radikal.ru/fp/0382a180315e475ab9ce66d47f96b123
и так?
radikal.ru/fp/bcb48250cc14419c9f32954cdefa8b7e
но это совершенно не то, что мне нужно - блок ни разу не по центру, все на друг друга налезает..