How to lock scrolling in HTML?

Question

I have this code: https://code.sololearn.com/Wd04Wx4OaDL3

I want that the button do go outside the screen, but then scrolling should be locked. I mean, user can't see that the button is there, and I can translate it back to the screen whenever I need it.

How can I do this?

[ Note ] I just want to lock horizontal scroll, vertical should work fine.

Answer 1

Tried adding max-width and overflow-x properties for the html and body?
html, body{
max-width:100%;
overflow-x:hidden;
}
It should be helpful for you.

Answer 2

Shashi Ranjan Woo, thanks, it worked😊

Answer 3

overflow-x property work for horizontal scroll and overflow-y for vertical. And default value is auto.

Answer 4

Try using the overflow-x property