Archived topic
Button(s) allignment in tablet/mobile
5 replies · Started by David on August 10, 2021
I have a new site I'm working on.
I started 4 buttons with one of the pre-made buttons in GBP
I have adjusted the margins, and it looks fine in development, but on tablet and mobile the 4 buttons (stacked) are more right aligned.
It's on SiteGround and cache has been cleared, but It persists and I can't work out why!
TIA, Dave
Hi there,
As it is now, it seems to be inheriting the 50px margin set on desktop and it's causing the buttons to be pushed to the right.
Can you try setting a different margin for tablet and mobile? You can set it on the tablet and mobile tab for the specific blocks. :D
Thanks Elvin,
Yes that was it.
I added left and right margin for tablet (which went to mobile) so the buttons were not full width.
How would I make the buttons not be full width on tablet ?
Would I need custom CSS to make them a fixed width and centered on tablet ?
TIA, Dave
Would I need custom CSS to make them a fixed width and centered on tablet ?
Yes that's pretty much what we have to do.
Set a unique class for the button's wrapper and do CSS like this example.
Example:
@media(max-width:1024px){
.your-custom-css-class .gb-button {
width: auto !important;
}
}
Marking as resolved!
Thanks, Dave
Nice one. Glad you got it sorted. :D