Позиция: абсолютные разрывы крайнее левое: авто

Question

Я пытаюсь расположить свое гамбургер-меню в правой части навигационной панели, используя margin-left: auto и display: flex на контейнере. Когда я даю навигационную позицию: absolute, она ломается. Что мне нужно сделать?

HTML

<section class="nav">
    <div class="nav-items">
        <a href=""><h2 class="logo">logo</h2></a>
        <div class="hamburger">
            <div class="hamburger-lines"></div>
        </div>
    </div>
</section>

CSS

.nav {
    position: absolute;
}
.nav-items {
    display: flex;
}
.hamburger {
    margin-left: auto;
}

Answer 1

Он ломается, потому что вы не устанавливаете ширину . Попробуйте установить ширину примерно на 100%

.nav {
    position: absolute;
    width: 100%;
}