# Custom collection in a horizontal view

**URL:** <https://community.glideapps.com/t/custom-collection-in-a-horizontal-view/72874>\
**Category:** Ask for Help\
**Tags:** custom-css\
**Created:** [April 26, 2024, 5:41am UTC](https://community.glideapps.com/t/custom-collection-in-a-horizontal-view/72874 "2024-04-26T05:41:37Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![Darko\_Vukoje](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/darko_vukoje/32/73227_2.png) [@Darko\_Vukoje](https://community.glideapps.com/u/Darko_Vukoje)\
**Post date:** [April 26, 2024, 5:41am UTC](https://community.glideapps.com/t/custom-collection-in-a-horizontal-view/72874/1 "2024-04-26T05:41:37Z")

</div>

I have a use case to display a bunch of information in a horizontal view. Users should be able to scroll horozontally.

I achieved that with card collection in a horizontal view but need to display additional information, maybe more than one image per item.

Is it possible somehow to have a custom collection in horizontal view?

Thanks

---

<div class="post-metadata">

**Author:** ![ThinhDinh](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/thinhdinh/32/49_2.png) [@ThinhDinh](https://community.glideapps.com/u/ThinhDinh)\
**Post date:** [April 26, 2024, 11:37pm UTC](https://community.glideapps.com/t/custom-collection-in-a-horizontal-view/72874/2 "2024-04-26T23:37:23Z")

</div>

I doubt this is easy to do with just CSS since under the hood, the construction of a horizontal list is much different from a vertical list, but interested in what @tuzin @Eric_Penn @Himaladin might have to say about this.

---

<div class="post-metadata">

**Author:** ![Himaladin](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/himaladin/32/71023_2.png) [@Himaladin](https://community.glideapps.com/u/Himaladin)\
**Post date:** [April 27, 2024, 2:36am UTC](https://community.glideapps.com/t/custom-collection-in-a-horizontal-view/72874/3 "2024-04-27T02:36:40Z")

</div>

Which components would you like to place inside your “custom collection” component? Could you provide an image illustration of what you want to achieve?

---

<div class="post-metadata">

**Author:** ![Himaladin](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/himaladin/32/71023_2.png) [@Himaladin](https://community.glideapps.com/u/Himaladin)\
**Post date:** [April 27, 2024, 4:13am UTC](https://community.glideapps.com/t/custom-collection-in-a-horizontal-view/72874/4 "2024-04-27T04:13:02Z")

</div>

Maybe for now, let’s just use this component.

![Screenshot 2024-04-27 at 11.10.27](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/c/2/c269c307e473c350eedfa5d73e04273f221a9a17.png)

 ![Screenshot 2024-04-27 at 11.10.01](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/0/b/0bc1544eab9068b222882b4044b04ac649f10c3a.jpeg)

```auto
[data-testid="wire-container-test"] > div > div > div > div:first-child {
   margin-top: 0px;
}

[data-testid="wire-container-test"] > div > div > div {
    display: flex;
    flex-wrap: nowrap;
    overflow-x: scroll;
}

[data-testid="wire-container-test"] [data-testid="wire-component-stack"] {
width: 200px;
}

```

---

<div class="post-metadata">

**Author:** ![ThinhDinh](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/thinhdinh/32/49_2.png) [@ThinhDinh](https://community.glideapps.com/u/ThinhDinh)\
**Post date:** [April 27, 2024, 11:42pm UTC](https://community.glideapps.com/t/custom-collection-in-a-horizontal-view/72874/5 "2024-04-27T23:42:37Z")

</div>

Added this to [the library](https://css-library.glide.page/dl/library/s/8836b3/r/W-U.iP6sREuQYssTKmmllA). Thank you!
