Is there a way to make the scrolling bar in a div block invisible on a Webflow CMS page?

Published on
September 22, 2023

Yes, there is a way to make the scrolling bar in a div block invisible on a Webflow CMS page. Here's how you can achieve this:

  1. Select the div block that you want to remove the scrolling bar from.

  2. In the Styles panel, click on the gear icon next to the "Overflow" property.

  3. In the Overflow settings popup, change the "Overflow" property from "Visible" to "Hidden".

    This will hide the scrolling bar and any content that overflows the boundaries of the div block will be hidden.

  4. If you still want the content to be visible but without the scrolling bar, you can use custom CSS to achieve this. Here's how:

  • Select the div block and go to the Settings tab in the right-hand panel.

  • Give the div block a class name (e.g., "no-scroll").

  • Go to the Custom Code section in the Dashboard.

  • In the Head Code section, add the following CSS code:

    ```css

    ```

    This code targets the div block with the class name "no-scroll" and customizes the appearance of the scrollbar.

  1. Publish your site for the changes to take effect.

By following these steps, you can make the scrolling bar in a div block invisible on a Webflow CMS page.