Next.js Discord

Discord Forum

overflow-x:hidden; prevents smooth scrolling

Unanswered
Barbary Lion posted this in #help-forum
Open in Discord
Avatar
Barbary LionOP
i attached a video to better exhibit the behavior ignore the position in the css i was testing something. As you can see when I set overflow-x:hidden; it seems the body takes the size of screen currently being viewed then when you try scrolling it stops as if page ends there but then if i try to scroll again it resolves. But the issue doesn't appear when there is no overflow-x but i need the overflow-x to be hidden bc then i am left with blank space to right side of the page. This code was working completely fine on React but not on NextJS. The css code that i have in global.css is currently
html, body {
    margin: 0;
    overflow-x: hidden;
    background-color: rgb(9,9,8);

}
Image

2 Replies

Avatar
body {
    overflow: hidden;
}
body, html {
  height: 100%;
  margin: 0;
  padding: 0;
}
Avatar
Barbary LionOP
didnt work 😦