Почему блок отображается некорректно в Mozilla?

Question

[metori]

Привет. Столкнулся с проблемой: idontcare.zzz.com.ua
Во всех браузерах нормально показывает (по центру), а в мозилле изначально появляется блок наверху, но при ресайзинге окна хоть на 1 пиксель в любую сторону становится на место. В чем прикол может быть?

Answer 1

[Михаил Захаров]

Не используйте костыли в виде фиксированных ширины и высоты, а потом margin.
Сделайте так:

div.section.fp-section {
display: flex;
flex-direction: column;
}
div.section.fp-section>* {
margin: auto;
}

Селекторы, ясное дело, вставите свои.

Comments

[metori]

Cпасибище)

[Михаил Захаров]

metori: обращайтесь )

[metori]

Михаил Захаров: обращусь еще раз, что-то не так все равно. Где именно поправить в коде нужно? В хроме ведь все хорошо, в мозилле по факту же тоже. Скажите, пожалуйста, что убрать/на что поменять, а то я не особо шарю в этом

[Михаил Захаров]

metori: завтра напишите ответ на этот комментарий и я зайду )

[metori]

Михаил Захаров: пишу) Проблема, я так понимаю, в .fp-section и wrapper? Я обычно методом тыка исправляю ошибки, а тут вообще не въезжаю, почему везде грузится нормально, а в мозилле нужно ресайз окна сделать..., ведь если его сделать, то все на своих местах.

[Михаил Захаров]

metori: проблему правильно поняли. Попробуйте указать для тех блоков те стили, что я указал и отпишитесь по результату.

[metori]

Михаил Захаров: Да, если честно, все плывет. Либо не там меняю, либо еще что-то

[Михаил Захаров]

metori: в общем, блок, который нужно разместить по центру, должен быть margin: auto;. Его родитель должен быть шириной и высотой в 100% и иметь display: flex;. Жду фидбэка.

[metori]

Михаил Захаров: инфа съехала в таком случае, которая открывается при нажатии на ссылку.
Я перекинул все на codepen: https://codepen.io/anon/pen/EXBmxQ
Если не сложно, поправьте, а я быстро потом исправлю это на локалке(а то на кодпене не понятно), чтоб в мозилле посмотреть.

[metori]

Михаил Захаров: вообще ничего не выходит :/ Меняю одно - летит другое