Почему при верстке флекс блока, у внутреннего блока слетает верхний отступ, если у нижнего блока убрать свойство display: flex?

Question

[Сергей Сунцев]

Собственно есть код.
Если у элемента ul убрать display: flex;
То слетают отступы у соседнего элемента, можете подсказать в чем тут причина?

Answer 1

[Арсений Матыцин]

https://developer.mozilla.org/ru/docs/Web/CSS/CSS_... читай.

Элементы со свойством display: flex игнорируют эти правила.

Answer 2

[Froggyweb]

потому что у тебя фиксированная высота шапки. Старайся никогда не задавать высоту блокам вообще. Только в очень крайних случаях. Это очень плохая практика.

Comments

[Сергей Сунцев]

А можно по подробней, получается, если мы задали height элементу header, из-за этого у него смещается отступ?
Может есть какой материал, где описано это поведение?

[Froggyweb]

Сергей Сунцев, у тебя элементы выровнены по центру хедера а не за счет отступов менб становится выше поэтому все смещается
сами отступы никуда не деются

[Арсений Матыцин]

Чепуха