How to Add Margins Around Buttons
At https://www.maxiwalkeruniform.com/ I have three buttons side by side in the full width image at the very top of the page. When the page is viewed on mobile, the buttons stack on top of one another, but they crash into each other. I have tried to add custom CSS to force a margin to the buttons, but it is not working. The CSS I added is
.button{
margin: 20px !important;
}
Is my CSS wrong, or is this not possible and the buttons just have to crash on mobile devices?
Comments
Hello,
Did you handle your issue?
Because I have checked your website on mobile, and these buttons are not stacked, and there are gaps between them.
Cheers
Those are linked images, not buttons. I created images that look like a button, as a workaround, since I can add margins to images. I know this is not a best practice or desired permanent solution, though, so if there is a way to use actual buttons as I should (instead of images) and add the spacing, please advise how I can do so. Thanks!
.
If you put these buttons in separate wraps, then you will be able to put the padding for them.
3) If you want your whole menu to be blue, please, use the following code:
.mhb-view.mobile li{ background-color: #2991d6!important; }Thanks