Easy way to remove scrollbar for horizontal repeating group

Hi everyone, I’m trying to create a horizontal repeating group just like most popular apps have nowadays however I’m struggling with removing the scrollbar on desktop/laptop devices.

Is there an easy way to remove this without using a plugin?

Searched the forums and none of the tips from the previous threads seems to work. Any advice would be much appreciated!

Here’s some CSS to customize your scrollbar visibility. You can add it to a specific page’s header or in the SEO/Metatags section for all your pages.
First assign an element ID to the re[eating group. Lets say it’s ‘myRG’:

/* Hide scrollbar for Chrome, Safari and Opera */
#myRG::-webkit-scrollbar {
  display: none  !important;
}

/* Hide scrollbar for IE, Edge and Firefox */
#myRG {
  -ms-overflow-style: none !important;  /* IE and Edge */
  scrollbar-width: none !important;  /* Firefox */
}

Cheers,
Ranjit from Atomic Fusion

Explore and reuse the community’s Bubble assets & Accelerate your Bubble development with Atomic Fusion

4 Likes

Finally figured out how to remove it based on the tip above…but turns out horizontal scroll doesn’t work very well on desktops/laptops without the scrollbars…the problem is that they are really clunky and ugly looking, especially since I have several rows of them back to back.

Does anyone know if there is an easy way to customize these to make them a bit skinnier and sleek looking on desktops (similar to the automatic look on mobile)?

Could you not use the same method as above and customize the scrollbar using css? But yeah the agreed the rg horizontal scroll looks terrible on computers…

This topic was automatically closed after 70 days. New replies are no longer allowed.