Glitch Overflow de CSS inattendu

Je lance un problème que j'ai utilisé sur le débordement de CSS.

J'ai une page que j'ai l'intention d'être réactif. Le menu de navigation est ce qui cause mon problème. P>

spécifiquement la déclaration "Overflow-x: Caché" DÉCLARATION "... P>

Au début, je pensais que la question pourrait être liée à devtools ( ou plutôt mon utilisation abusive) mais j'ai testé le site sur deux téléphones mobiles et il est pareil ... p>

La chose intéressante est la façon dont le débordement n'est pas masqué tant qu'il y ait un événement clic, je Pensez que la solution est liée à ce fait ... peut-être haha ​​ p>

https://www.youtube.com/watch?v=_hscahd-1ig P>

J'apprécierais vraiment que quiconque examine la vidéo et me donner des conseils. Merci. P>

mise à jour: comme indiqué sur ... je devrais vraiment ajouter le code aussi ... p>

html (index.html): p> xxx

CSS (style.css): p> xxx pré>

js (app.js): p>

const navSlide = () => {
    const burger = document.querySelector('.burger');
    const nav = document.querySelector('.nav-links');
    const navLinks = document.querySelectorAll('.nav-links li');
    
    
    
    
    burger.addEventListener('click', () => {
        //Toggle Nav
        nav.classList.toggle('nav-active');
        
        //Animate Links
        navLinks.forEach((link, index)=>{
            if (link.style.animation) {
                link.style.animation = '';
            } else {
                link.style.animation = `navLinkFade 0.5s ease forwards ${index / 7 + 0.5}s`;
            }
        });
    });

}

navSlide();