Archived topic

horizontal scroll container

3 replies · Started by melvin on November 20, 2020

Viewing posts 1–4 of 4

November 20, 2020 at 1:37 am #1538583

Hi,

Can i possibly achieve the below? Instead of becoming 2 row in mobile, I wish to achieve become 1 row in mobile with horizontal scroll.

https://imgur.com/a/jzDAgiv

This is the page I use GB on

Thanks

November 20, 2020 at 3:11 am #1538657

Hi there,

try adding this CSS:

@media(max-width: 769px) {
    .gb-grid-wrapper.scrollable {
        flex-wrap: nowrap;
        overflow-x: auto;
        scroll-snap-type: mandatory;
    }
    .gb-grid-wrapper.scrollable .gb-grid-column {
        flex: 1 0 50%;
        scroll-snap-align: start;
    }
}

Then edit the Grid Container ( the parent wrapped ) and give it a CSS Class of: scrollable

November 22, 2020 at 7:00 pm #1541667

Hi David,

Thanks it work well.

Have a nice day

Regards,
Melvin

November 23, 2020 at 1:17 am #1541894

You're welcome

This archived topic is closed to new replies.

Start building better websites today.