@raulvodov

Как выравнить логотип по центру?

Имеется логотип, который состоит из h1 для текста лого и before для иконки рядом с текстом.
Этот лого нужно выровнить по центру.
Если вставить этот код
left: 50%;
transform: translateX(-50%);

То браузер видит только h1, т.е. центрирует ее относительно экрана.
Попробовал подобрать left: 47%, на большом экране хорошо смотрится, но стоит уменьшить размер браузера, то лого уже не по центру. Как наиболее рационально решить ситуацию? Строго не судить, т.к. это можно сказать моя первая верстка :)

5aa438c67b16d974192576.png
  • Вопрос задан
  • 153 просмотра
Решения вопроса 1
@MrGaunt
Сделайте у логотипа padding-left: {размер псевдоэлемента + отступ}, а у :before left: 0 вместо отрицательного. Благодаря padding в размер логотипа будет входить псевдоэлемент и transform: translateX(-50%) даст нужное значение.
Ответ написан
Пригласить эксперта
Ответы на вопрос 1
KickeRocK
@KickeRocK
Atom Power!
Это всё в div'e?
Если нет, то оберни в div и поставь
.etot-div {
margin: 0 auto;
}

ну или всему footer'у
.footer {
display: flex;
justify-content: center;
}
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через TM ID
Похожие вопросы
Reklama Guru Санкт-Петербург
от 50 000 до 60 000 руб.
Blogman Оренбург
от 20 000 до 60 000 руб.
Sveak Барнаул
от 40 000 руб.
18 авг. 2018, в 09:13
13000 руб./за проект
18 авг. 2018, в 01:10
17000 руб./за проект
17 авг. 2018, в 23:00
5500 руб./за проект