Как центрировать модальное окно по вертикали?

Question

[sitev_ru]

Отображаю модальное окно, но оно отображается сверху.

Как отобразить его по середине?

Answer 1

[Хазрат Гаджикеримов]

left:0;
right:0;
top:0;
bottom:0;
position:absolute;
margin:auto;

Comments

[sitev_ru]

Почему-то у меня не работает вами предложенный вариант?

[Хазрат Гаджикеримов]

sitev_ru: потому что нужно указывать размеры блока, который необходимо центрировать

Answer 2

[Дима Паутов]

transform: translateY(-50%);

Comments

[sitev_ru]

Почему то мне подошло это transform: translateY(25%);

[sitev_ru]

Если я делаю -50, то я окно не вижу

[Дима Паутов]

Не знаю как вы там применяете и зачем вообще изменили -50 на 25. Вот пример!!!!!!!!!! jsfiddle.net/gkn03gfm

[Дима Паутов]

sitev_ru: Сначало погуглите центрирование по вертикали и горизонтали, а потом с вопросами сюда!

[sitev_ru]

jsfiddle.net/c0z8a8ox

[sitev_ru]

надо top: 50%; тогда transform: translateY(-50%);

[sitev_ru]

Стоп... Это решение не работает на маленьком экране... Включается какая-то странная прокрутка... На сотовом тоже проблема - окно убегает куда-то вниз

[Дима Паутов]

sitev_ru: Медиа запросы пишите!

Answer 3

[Сергей Зеленский]

top:50%;
margin-top: - <высота окна> px

Comments

[sitev_ru]

Откуда я узнаю высоту окна?

[Сергей Зеленский]

от волшебника из страны Оз))

[Odinokun]

Сергей Зеленский: а про vh слышал?

[Сергей Зеленский]

Дмитрий:слышал)

Answer 4

[Леван]

$( elem ).css({
   "width": ( window.innerWidth - $(elem).width())/2+"px"
})