Webflow sync, pageviews & more.
NEW
Answers

How can I hide the scrollbar line that appears on my Webflow site when I have a horizontal scroll with Auto on mobile?

To hide the scrollbar line that appears on your Webflow site when there is a horizontal scroll with Auto on mobile, you can use custom CSS code. Here's how you can do it:

1. Find the element that has the horizontal scroll on your Webflow site. This could be a section, a div block, or any other element.

2. Give that element a unique class name. You can do this by selecting the element, going to the settings panel on the right side, and adding a class name in the Class field.

3. Once you have added the class name, go to the Custom Code section of your Webflow project. You can access it by clicking on the gear icon in the top right corner and selecting the Custom Code option.

4. In the Custom Code section, click on the `` tag to add code within it.

5. Add the following CSS code inside the `

```

6. Replace `.your-unique-class` in the CSS code with the actual class name you assigned to the element in step 2.

7. Save the changes and publish your site.

Now, the scrollbar line should be hidden when there is a horizontal scroll on mobile. The width of the scrollbar is set to 0 pixels, making it invisible, and the background color of the scrollbar is set to transparent.

Rate this answer

Other Webflow Questions