Элементы накладываются друг на друга и выводятся с неправильными размерами объясните в чём проблема?

Question

[fails1]

Comments

[Lynn «Кофеман»]

Покажите код

[fails1]

Lynn «Кофеман», Код на скриншоте

[Сергей delphinpro]

fails1,

Код на скриншоте

3.8. Использовать для демонстрации фрагментов кода только специальный тег < code > или специальные демонстрационные ресурсы (например, JsFiddle - https://jsfiddle.net/). Размещение фрагментов кода в виде изображений запрещено.

https://qna.habr.com/help/rules

[Ankhena]

Элементы накладываются друг на друга

Не вижу, чтобы они накладывались.

выводятся с неправильными размерами объясните в чём проблема?

Потому что по умолчанию flex-shrink равен 1 и элементы пытаются сжаться, чтобы поместиться в контейнер.
Поставьте flex-shrink: 0, чтобы они перестали это делать.

[Антон Литвиненко]

а какого поведения ожидали? независимо от ширины элементы сужаются чтобы влезть в контейнер.

Answer 1

[Collonil Tolli]

Просто напросто не влезает в шапку.
чтобы элементы не скакали, не стоит использовать абсолютную ширину, лучше пользоваться

max-width: 3423923px;
width:100%;

так они не будут прыгать по всей странице.
так же, если используются флексы, то flex-wrap: no-wrap;будет весьма не плохим решением.