# 3-Column Horizontal Scroll Repeating Group

## Overview

![](https://1483599141-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LbzMeM9XfnblRd78nga%2F-MW2r8hsONq1MvP1357k%2F-MW2s2297Jsgq7ZSSwqO%2Fimage.png?alt=media\&token=a6c5b766-7b8d-445d-96af-82dbd779d414)

This horizontal scroll repeating group is fully-responsive and scrolls off-screen. It is ideal for displaying blog posts, videos, and articles. This block includes an image, small gray text, title text, and a link.

## Structure

* When this module is added to a page, it is placed within a group called **Blocks container 860 (do not rename)** on the page. This group contains the responsive settings for all blocks.
* All data is displayed in **RepeatingGroup Dummy**

## How to set up

* Update **RepeatingGroup Dummy's** data source 
* Update the data source of the image and texts
* Remove any elements in the module that you do need 

## Hide scroll bar

* You can hide the repeating group scroll bar by adding the following code to the page HTML header:

{% hint style="info" %}
Custom page HTML headers are only applied to apps that are on a paid Bubble plan. If you do not have a paid Bubble plan for your app, you can simply add the following script in an html element and put it towards the top of the page.
{% endhint %}

`::-webkit-scrollbar {`\
  `width: 0px;`\
  `height: 0px;`\
`}`\
`::-webkit-scrollbar-button {`\
  `width: 0px;`\
  `height: 0px;`\
`}`\
`::-webkit-scrollbar-thumb {`\
  `background: transparent;`\
  `border: 0px none;`\
  `border-radius: 0px;`\
`}`\
`::-webkit-scrollbar-thumb:hover {`\
  `background: transparent;`\
`}`\
`::-webkit-scrollbar-thumb:active {`\
  `background: transparent;`\
`}`\
`::-webkit-scrollbar-track {`\
  `background: transparent;`\
  `border: 0px none;`\
  `border-radius: 0px;`\
`}`\
`::-webkit-scrollbar-track:hover {`\
  `background: transparent;`\
`}`\
`::-webkit-scrollbar-track:active {`\
  `background: transparent;`\
`}`\
`::-webkit-scrollbar-corner {`\
  `background: transparent;`\
`}`