- This topic has 3 replies, 2 voices, and was last updated 3 years, 3 months ago by
.
-
Posts
-
I know it’s probably a CSS setting that I am missing, but I am trying to create a grid of 4 buttons. On desktop, they would all be in one row straight across. As the screen width decreases to tablet and mobile, the buttons should stack appropriately when there isn’t room in the row.
The problem that I am having is that desktop and mobile look fine, the buttons stack on mobile as you would expect. But on tablet or any reduced width, the buttons themselves start to shrink down. See an image of this here: https://i.redd.it/3743kym5bgfa1.png
Is this CSS, or a setting on the buttons/grid that I need to change?
Thank you
Customer Support
Hi Colby,
Are you adding 1
Buttonsblock to eachcontainerof theGridblock?If so, I would recommend do NOT using
Gridblock for this, you just need to add multiplebuttonblocks within the samebuttonsblock.You can select a button block, and click the
+icon on the floating tool bar to duplicate abuttonblock: https://docs.generateblocks.com/article/buttons-overview/#buttons-containerOnce it’s done, if there’s still an issue, can you link us to your site where we can see the buttons?
Let me know 🙂
That was it! I changed from using the grid to just the button blocks. Originally I was using grid because it allows you to easily space between the grids, but I just did it with margins on the buttons instead. Works great now, thank you!
No Problem, glad to help 🙂
- You must be logged in to reply to this topic.
