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?

When using the Auto Scroll feature in Webflow, a scrollbar may appear, distracting from your design. Here's how you can hide it.

1. Access Custom Code Settings

• Go to Project Settings in Webflow.
• Click on the Custom Code tab.

2. Add Custom CSS to Hide Scrollbar

• In the Head Code or Footer Code section, add the following CSS to target your specific div and hide the scrollbar:

.your-div-class { scrollbar-width: none; /* For Firefox */ -ms-overflow-style: none; /* For Internet Explorer and Edge */ } .your-div-class::-webkit-scrollbar { display: none; /* For Chrome, Safari, and Opera */ }

• Replace .your-div-class with the exact class name of the div where the scrollbar appears.

3. Save and Publish

• Save the changes in Custom Code.
• Republish your site to apply the changes.

Summary

You can hide the scrollbar by adding CSS to your Webflow project’s custom code section, targeting the specific div to ensure a cleaner user experience.