Как в justify-content разместить элемент по центру?

Question

[guuugga]

Привет, использую justify-content: space-between для размещения элементов по краям, но у меня их 3 (меню из 2-х пунктов, лого, переключатель темы). Меню и переключатель расположены по краям а лого не по центру. Я понимаю как работает space-between но как мне разместить лого по центру?

https://jsfiddle.net/7rz3ux8e/

На фиддле возможно всё норм, но просто картинок нету - из-за этого кажется что по центру всё

Comments

[Ankhena]

Тут суть та же https://qna.habr.com/q/1088262

Answer 1

[Denis]

1. Возможно картинки не по размеру, и поэтому только кажется, что они не по центру (вы не отправили картинки, поэтому это только предположение)
2. Для каждой картинки примените свойства: transform: translate(-50%);

Полная версия в комментах

Comments

[Denis]

Также можете применить вместо space-between space-around

[Denis]

Ну и, наконец, чисто технически, отсчёт расстояний у картинок начинается от их краёв, поэтому такая проблема и возникает.

[Denis]

Также space-between выставляет одинаковые расстояния между тремя объектами.

Первый объект заголовков - слишком большой и не равен вашим картинкам.

Решение - поместите три блока одинаковой ширины, внутрь их поместите картинки или другие блоки.

Затем оперируйте центрированием и блоков, и внутренностями блоков.

[Denis]

Вот что будет, если воспользуетесь space-around и добавите к img свойствоtransform: translate(-100%);