The grid I have isn’t responding to smaller devices. It just looks bad.
I am trying to look like this on Mobile / Tablet 
Any ideas?
Also: how to I make all my buttons evenly spaced, including the “All” button even though it is not part of a collection?
Here is my site Read-Only: LINK
https://preview.webflow.com/preview/ashfishman?utm_medium=preview_link&utm_source=designer&utm_content=ashfishman&preview=73b2750bc165695e65d946800356319d&pageId=638e3442d1ffffdc9786b9c5&workflow=preview
Hey Ash, at the top there, the filter buttons you’ve shown aren’t in a grid layout. They’re flowing naturally left to right, top to bottom. A horizontal flex with child wrapping would work much better.
For your buttons, go for one common style class on each of the buttons directly, including your All button. That filter button class should style the buttons but also assign the right & bottom margins to space them.
No matter what you’re going to face some issues with that All filter button, because it’s outside of the collection list. It’s just at a different level of flow than the other filter buttons. That won’t affect you on desktop, but on mobile you’ll either want to hide it ( if all is too many, anyway ), or give it its own line.
That should get you started.
I recommend you go find some cloneables that use filter buttons, and learn how they are doing the styling and layout to organize them responsively, it will help a lot. Even better if it’s using the same filter lib you’re already working with.
hey not following what you mean that the filter buttons are not in a grid?
It says grid there ?
Do you perhaps have a Loom on how to proceed?
hey i managed to figure out what you meant in terms of child flex (i think/hope)
But not I have a new issue:
This layout looks pretty weird, and I would prefer there being a row of 3 and then 2 buttons. how do I do that?
Similarly: this layout just looks god awful. would much rather have the same row setup here (if I am unable to do something like the image shown above in my original post where everything is aligned.
Thanks!!!
hey just following up with this to see if anyone can help?
