Why horizontal scrolling with custom CSS is not working

I am trying to follow this infinite scroll tutorial Creating Infinite Horizontal Scrolling with Pause on Hover in Webflow

But the animation doesn’t work.

Here is the staging the piece with a lot of horizontal screens): Online club for UX learners by uxberg school

I renamed the variables accordingly

If someone could point me out on where there is an issue I’d be grateful: Webflow - uxberg school — UX/UI design courses and hackathons


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

hi @BeigeMage basic CSS rule is that using capital letter are invalid

This means that in your code replace any capital letter and all will work.

I see many users do identical mistake as they follow Finsweet client first where this awful syntax is as recommended and Webflow allows use this capitalisation. But for CSS are these practices invalid.

I will also suggest using dashes that is another CSS convention and it adds legibility as h-scroll-wrapper is more legible than HscrollWrapper but it is not an issue and it is up to you how you will structure your selectors names.

I will suggest to get some basic CSS knowledge by reading something about CSS systems like BEM that may help you in future. :vulcan_salute:

Here are a few articles about CSS conventions but there are great video courses covering CSS in detail.