# Ideas for this horizontal scroll bar for RG?

**URL:** <https://forum.bubble.io/t/ideas-for-this-horizontal-scroll-bar-for-rg/317813>\
**Category:** Need help\
**Created:** [April 15, 2024, 4:38pm UTC](https://forum.bubble.io/t/ideas-for-this-horizontal-scroll-bar-for-rg/317813 "2024-04-15T16:38:35Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![bryce](https://avatars.discourse-cdn.com/v4/letter/b/8edcca/32.png) [@bryce](https://forum.bubble.io/u/bryce)\
**Post date:** [April 15, 2024, 4:38pm UTC](https://forum.bubble.io/t/ideas-for-this-horizontal-scroll-bar-for-rg/317813/1 "2024-04-15T16:38:35Z")

</div>

Anyone know the best way to get a Horizontal scrolling bar that controls a repeating group exactly like the example in the video?  
Anyone know some html/css and javascript to make this work? Can’t find a solution that’ll work like the example for a [bubble.io](http://bubble.io) project.

[  
Horizontal Scroll Bar controlling repeating group - Watch Video  
 ](https://www.loom.com/share/f95e4215618444d2a5a0879252961a4d)[![](https://cdn.loom.com/sessions/thumbnails/f95e4215618444d2a5a0879252961a4d-with-play.gif)](https://www.loom.com/share/f95e4215618444d2a5a0879252961a4d)  
[https://www.loom.com/share/f95e4215618444d2a5a0879252961a4d?sid=d247f94a-0252-4c1c-8266-afc88507a2df](https://www.loom.com/share/f95e4215618444d2a5a0879252961a4d?sid=d247f94a-0252-4c1c-8266-afc88507a2df)

---

<div class="post-metadata">

**Author:** ![edgarmolen97](https://avatars.discourse-cdn.com/v4/letter/e/87869e/32.png) [@edgarmolen97](https://forum.bubble.io/u/edgarmolen97)\
**Post date:** [April 15, 2024, 6:01pm UTC](https://forum.bubble.io/t/ideas-for-this-horizontal-scroll-bar-for-rg/317813/2 "2024-04-15T18:01:57Z")

</div>

This one is tricky, The table element doesn’t support this feature yet, which I think its crucial for any table to be able to freeze columns and rows…

I haven’t come to the desperate need of this so far but the only way I can think it could be done is with a combination fo two Tables  
In a Group with Row Alignment, add a table element that is going to be one column, the first one, and make it 20% of fixed width for example, whatever works for you.  
Then add another Table element of 80% fixed width that is right next to it and add as many columns as you need  
Make sure both tables have the same data source and row heights  
Make sure they stretch tto full height and make the PARENT group and allow scrolling, this is to make sure the tables DONT have a scrollbar in the tables, instead they push the height of the parent group, which will have the scroll bar in case your table(s) have data that overflows the height.

by doing this there is no way to “freeze” the header row so if you scroll down on the parent group, you’re going to loose the header row… I gues its a trade off…

Let me know if it works and if you have further questions on this implementation!

---

<div class="post-metadata">

**Author:** ![system](https://us1.discourse-cdn.com/bubble/original/3X/2/8/2847faa74692c2ffa5d939d3dc3724cdd060d247.png) [@system](https://forum.bubble.io/u/system)\
**Post date:** [June 24, 2024, 4:38pm UTC](https://forum.bubble.io/t/ideas-for-this-horizontal-scroll-bar-for-rg/317813/3 "2024-06-24T16:38:52Z")

</div>

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