How do I add padding around buttons so they don't touch each other in site hero?

[rossnmia]

I need to add css code to add some padding around buttons so when they are bunched together on two lines in my site hero they have gaps between the two lines of buttons please? I can adjust line height but that does not apply to buttons. If I can add a transparent border that would be great.

Thanks

Mia

[David Customer Support]

Hi there,

If this is your markup:

<a href="#" class="button hero-button">Button 1</a>
<a href="#" class="button hero-button">Button 2</a>

They will be displayed inline. To put some space between them horizontally:

.hero-button {
    margin-right: 15px;
}

If you want them stacked:

.hero-button {
    display: block;
    margin-bottom: 15px;
}

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Author]

Posts