Webflow sync, pageviews & more.
NEW
Answers

How can I hide the scrollbar that appears in the middle of the screen when using the "Auto Scroll" feature in Webflow for my left-aligned div?

To hide the scrollbar that appears when using the "Auto Scroll" feature in Webflow for a left-aligned div, you can use some custom CSS.

First, make sure you have assigned a class to the left-aligned div. You can do this by selecting the div and going to the settings panel on the right-hand side of the Webflow Designer.

Next, go to the "Custom code" section of your Webflow project and click on "Add Custom Code."

Within the "Head Code" section, add the following CSS:

```

```

Make sure to replace `.custom-scroll` with the class name you assigned to your left-aligned div.

This CSS targets the scrollbar for the specific class and hides it by setting `scrollbar-width` to none (for Firefox), `-ms-overflow-style` to none (for IE and Edge), and `display` to none for the webkit scrollbar (for Chrome, Safari, and Opera).

Finally, go back to your Webflow Designer, select the left-aligned div, and add the class name (e.g., `.custom-scroll`) to the div's class field in the settings panel.

Publish your site to see the changes, and the scrollbar should no longer be visible when using the "Auto Scroll" feature for your left-aligned div.

Rate this answer

Other Webflow Questions