Streaming live at 10am (PST)

How to eliminate Overflow on horizontal scrolling site


Hi, I am working on a site. It’s not nearly done, but I am doing the horizontal scrolling. And I am wondering how do I get the page from scrolling horizontally all over? Is it an overflow setting? I can’t pinpoint where to apply the setting. Anybody? :slight_smile:

Here is my site Read-Only:
(how to share your site Read-Only link)


Hi @Stig_Ark, thanks for the question. I am not sure if I understand fully, is the objective to disable the horizontal scrolling section?


No. Maybe i am not explaining it well. I want it to scroll horizontally in the horizontal section. But the whole webpage scrolls horizontally when I scroll with my mouse. like on every section it scrolls to white space.


No ,i mean at every section, this is what i see in chrome on the first section when i scroll to the side. :stuck_out_tongue:



Hi @Stig_Ark, normally to hide the overflow, you would apply overflow:hidden to the parent element of the element causing the overflow, in this case your wrapper class with a 500vw width

I would probably nest the wrapper div that is 500vw within another div, and make the parent div have a style of overflow hidden. That will solve the overflow.

You may need to check your other section styling after making the overflow change.

The alternative is to remove the 500vw - or - change the layout structure and use a different horizontal scrolling technique (a lot is possible when using absolute or fixed position elements with scroll progress interactions).


Thank you so much. Do you have a link to a tutorial or lesson to some other horizontal scrolling techniques that will work better?


Hi @Stig_Ark, I don’t think you are too far off with the existing design, take a peek here:


I did not think so myself. But i got a little bit blind now :stuck_out_tongue_winking_eye:


Hi @Stig_Ark, look at step one of the tutorial link I sent, it talks about the div that need to be set to overflow hidden, I think that is the missing link :slight_smile: Interactions are like legos.


I have followed the steps as it says. I still have the trouble that the page scrolls horizontally on the other sections too. What I am doing wrong? I am new to this horizontal scrolling. and csant figure out the settings for the rest of the site.

closed #12

This topic was automatically closed 125 days after the last reply. New replies are no longer allowed.