Почему My Flexbox Navbar с выравниваемым левым логотипом и выравниваемым правым меню не работает, как и ожидалось? ⇐ CSS

[Anonymous]

Я пытаюсь спроектировать Navbar, где заголовок «сушимана» выровнен влево, а другие элементы списка (меню, еда, услуги и т. Д.) Выровнены вправо. Макет работает нормально, когда я следую учебному пособию на YouTube, но он не работает, как ожидалось на моей локальной машине. PrettyPrint-Override ">

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

.header__nav {
display: flex;
justify-content: space-between;
/* This will push the items to the edges */
align-items: center;
/* Vertically aligns items */
padding: 0 20px;
/* Adds space on the sides */
overflow: hidden;
}

.header__logo {
flex: 1;
display: flex;
position: relative;
padding: 20px;
}

.header__logo-overlay {
position: absolute;
inset: 0;
width: 100%;
}< /code>



[h4]SushiMan[/h4]

[list]
[*]
[url=#menu]Menu[/url]

[*]
[url=#menu]Food[/url]

[*]
[url=#menu]Services[/url]

[*]
[url=#menu]About Us[/url]

[*]

[img]./assets/search.svg[/img]
[/list]
[list]
[*]
[img]./assets/menu.svg[/img]

[/list]

Подробнее здесь: https://stackoverflow.com/questions/795 ... nu-not-wor