Streaming live at 10am (PST)

Horizontal scroll div

I want tho get this type of horizontal scroll when someone scrolls over a div,

so basically I made a div which is wider than the viewport and I want it to scroll to left when someone scrolls over it.

I am not custom code expert, can someone please help me?
Thanks in advance!


let us see what you have done so far.
Please share a read-only link of your project:




Have a look here:

This will actually force the user to see all the slides, I want it to be scrolling selectively, so user can hover over and scroll down on any slide show.

Ok. Than use:

-set a “div” to “overflow” “scroll”

  • put your content in this div
  • turn your div “90 deg”
1 Like

You are awesome! It works!
But only thing wierd is that when I rotate it, it get in different position and this position relates to the dimensions of the div:
If this can be solved, it will solve every problem.

Can you please help me?

You are right. It’s not easy to handle.
I found a way better solution:

  • create a “div”
  • set it to “flex”
  • set it to “overflow” “scroll”
  • put your content in this div

You have to scroll horizontally with your mouse

Thanks again,

I tried it but rotating this also gives the same issue. :sweat:

You don’t have to rotate it!
Make sure that you direction is horizontal

Yes I did that but now it does not scroll automatically, we have to slide the slider to move it.

I can move it by using Shift+Scroll, can we bind normal scroll to Shift+Scroll by anyway?

One last try to make you happy.
Build something like this:


  • width 100 %
  • height 400px


Hey!, I just tried this, didn’t worked for me, maybe doing something wrong.
But I was able to achieve this using some java script. I don’t know if its reliable.


I really appreciate your help.