Ответы пользователя по тегу JavaScript
  • Как зафиксировать меню бургер HTML&CSS&JS?

    @MaGTM
    Люблю делать то, что делаю
    Позиция меняется из-за относительного значения left в классе .header_navbar, чтобы это исправить в данном случае я бы поменял left на transform: translateX(-80%)
    А при открытии менял значение translateX
    .header_navbar {
        position: absolute;
        transform: translateX(-80%);
        top: 0%;
        width: 910px;
        height: 100vh;
        display: flex;
        justify-content: center;
        letter-spacing: 5px;
        align-items: center;
        backdrop-filter: blur(50px);
        border-right: 3px solid rgba(255, 255, 255, 0.5);
        transition: transform 2s;
    }
    
    .header.open .header_navbar{
        transform: translateX(-10%);
    }

    P.S. небольшой совет, в начале css файла лучше всего обнулять стандартные стили вот этой строкой
    * {
        margin: 0;
        padding: 0;
        box-sizing: border-box;
    }
    Ответ написан
    4 комментария