Правильно центрируйте элементы при использовании justify-content: space-between ⇐ CSS

Разбираемся в CSS
Anonymous
Правильно центрируйте элементы при использовании justify-content: space-between

Сообщение Anonymous »

Я создал панель заголовка и хочу разместить там 3 элемента. Первый должен быть выровнен по левой стороне, второй по середине заголовка, а третий по правой стороне.

Я так и сделал

Код: Выделить всё

body{
background: #eeeeee;
}

#header {
background: #ffffff;
height: 53px;
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
}

.headerEle {

}

Код: Выделить всё

[img]https://cdn.discordapp.com/attachments/316916526760591362/390814093340311565/unknown.png[/img]

[url=https://www.google.de/]Google[/url]

Logout


но при использовании justify-content: space-between; элементы центрируются неправильно. Изображение занимает больше места, чем маленькая кнопка справа.

Поэтому ссылка посередине не центрирована правильно, она перекрывает правую сторону. Я хочу, чтобы ссылка располагалась по центру страницы по горизонтали.

Подробнее здесь: https://stackoverflow.com/questions/478 ... ce-between

Вернуться в «CSS»