Почему не по середине?

Question

[smoklew]

Почему при просмотре на мобильных устройствах (max-width:768px) , логотип не становится по центру, хотя при уменьшении окна браузера с ПК - всё окей ? (Задан параметр: margin:auto;)

Пример ТУТ

Answer 1

[Настя]

Вам нужно сделать, чтобы логотип был сверху посередине и текст (слоган) - под логотипом?

Comments

[smoklew]

текст при меньших изображениях у меня убирается, стоит display:none; а вот логотип не становиться по середине

[Настя]

Смотрите. У вас у родительского контейнера header стоит свойство display:flex, поменяйте его на display:block. Далее - у картинки убираем float:left, т.е., .logo > img {float: none; height: auto;}. Далее у ссылки с классом .logo пишем свойства: display: block; overflow: hidden; text-align: center;
Теперь у текста .logo-description добавляете свойство text-align: center;

Таким образом все будет по центру. Вам мешало свойство display:flex у header.

[smoklew]

Настя: спасибо за совет, возможно переделаю)

[smoklew]

Настя: Достаточно было прописать для других браузеров свойство display:flex :)

Answer 2

[westdp]

попробуй задать картинке

img{
    margin: 0 auto;
    display: block;
}

Comments

[smoklew]

сделал, не помогает..

Answer 3

[Дмитрий Пыркин]

Замени max-width:768px на 980