# Custom Collection with Tiles buttons

**URL:** <https://community.glideapps.com/t/custom-collection-with-tiles-buttons/77521>\
**Category:** Ask for Help\
**Tags:** custom-css, collections\
**Created:** [October 31, 2024, 5:11pm UTC](https://community.glideapps.com/t/custom-collection-with-tiles-buttons/77521 "2024-10-31T17:11:54Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![Amure\_Pinho](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/amure_pinho/32/35988_2.png) [@Amure\_Pinho](https://community.glideapps.com/u/Amure_Pinho)\
**Post date:** [October 31, 2024, 5:11pm UTC](https://community.glideapps.com/t/custom-collection-with-tiles-buttons/77521/1 "2024-10-31T17:11:54Z")

</div>

Hello all, I want to chance button style on custom collections but i wasnt able to find the right way to implement CSS to do this.

I manage to change font, color etc, but not the style itself.

---

<div class="post-metadata">

**Author:** ![MaximeBaker](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/maximebaker/32/80877_2.png) [@MaximeBaker](https://community.glideapps.com/u/MaximeBaker)\
**Post date:** [October 31, 2024, 5:14pm UTC](https://community.glideapps.com/t/custom-collection-with-tiles-buttons/77521/2 "2024-10-31T17:14:37Z")

</div>

You need to set a CSS class in the button :

 ![image](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/4/8/48eba930ffe34a417dc4a04796de90d995d198d4.png)

And then add a custom class in the app Settings =\> Appearance =\> Custom CSS :

 ![image](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/2/0/206c69cc268d4448258ad3790a8b0efb065c4ac7.png)

---

<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:** [November 1, 2024, 12:06am UTC](https://community.glideapps.com/t/custom-collection-with-tiles-buttons/77521/3 "2024-11-01T00:06:00Z")

</div>

What exact style do you want to adjust?

---

<div class="post-metadata">

**Author:** ![Amure\_Pinho](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/amure_pinho/32/35988_2.png) [@Amure\_Pinho](https://community.glideapps.com/u/Amure_Pinho)\
**Post date:** [November 1, 2024, 11:58am UTC](https://community.glideapps.com/t/custom-collection-with-tiles-buttons/77521/4 "2024-11-01T11:58:04Z")

</div>

I want to make this:

 ![Captura de Tela 2024-11-01 às 08.51.00](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/2/5/25cde83a2d334ab3dcfea55073e863c173578f10.png)

But with Tiles button like this:

 ![Captura de Tela 2024-11-01 às 08.53.33](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/b/8/b8b6b2d98edd7ccc2f5096733ed11ba8362cd9d2.png)

The problem is that I want to use horizontal scrolling, not available on custom collection. But Card collection doesnt allow me to change button style.

I’ve changed CSS to allow horizontal nav on custom collection but I’ve had problems with the responsive “card size” making the design experience inconsistent.

So i thought that using card collection and change button style would be the easiest way to solve that. Makes sense?

---

<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:** [November 1, 2024, 2:56pm UTC](https://community.glideapps.com/t/custom-collection-with-tiles-buttons/77521/5 "2024-11-01T14:56:55Z")

</div>

Sounds good to me. Have you tried inspecting the button style in the 2nd screenshot, copy their CSS declarations and assign that to the “card collection” buttons?
