@artmirarmi

Flexbox горизонтальое выравниваие?

Как выровнять по центру по горизонтале тлько один элемент внутри flex контейнера?

https://jsfiddle.net/qz48nbwe/17/
  • Вопрос задан
  • 297 просмотров
Решения вопроса 6
daur_sdg
@daur_sdg
Добавил строки кода в эту ссылку
.slogan {
  color: #fff;
  font-size: 28px;
  display:block;
  width: 100%;
  text-align:center;
  position:absolute;
}
Ответ написан
Комментировать
profesor08
@profesor08 Куратор тега CSS
Любыми средствами сделай три колонки, содержимое средней центрируй. Имея только две колонки, ты никак не расположишь одну из них по центру не выдирая ее тем-же position: absolute.
Ответ написан
Ankhena
@Ankhena Куратор тега CSS
Нежно люблю верстку
Вот так: https://jsfiddle.net/7d0fwpmc/
Но если ширина логотипа будет неизвестна, то абсолютом.

Если вдруг по центру оставшегося пространства https://jsfiddle.net/u13tmyhj/
Ответ написан
Комментировать
.header {
  align-items: flex-start;
}
.slogan {
  align-self: center;
}
Ответ написан
@mikeyuriev
Можно добавить псевдоэлемент в .header:
.header::after {
  content: "";
  display: block;
  width: 174px;
}
Ответ написан
Комментировать
SecurityYourFingers
@SecurityYourFingers
I make other things, but i know that without your
.slogan {
color: #fff;
font-size: 28px;
margin-right: 30%/*!!!!!!!!!!!!!!!!!!!!!!!!*/
}
Ответ написан
Комментировать
Пригласить эксперта
Ваш ответ на вопрос

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

Войти через центр авторизации
Похожие вопросы