help with transparent buttons

I’m trying to get a handle on this & I see this CSS in the KB

But it does not seem to work for me.
And I’m wondering why it is needed, as there seems to be settings that cover this in the button configuration anyway?

Also when I place a button in a row, the hover effect makes the row below move up a bit - and it does it for me if I have the border at default 2 px or 0 px?
I would also like some guidance on how to style the buttons in other modules (e.g. the button in call to action), so I can style all buttons the same for consistency?

TIA, Dave

ps - sorry nothing to look at, just playing locally!

Just a quick follow up.
Not sure if it is relevant - but I notice two fa classes in the i tag when I add an icon to the button.
<i class="fl-button-icon fl-button-icon-before fa fa fa-cc-paypal"></i>

Hey Dave,

We placed that CSS snippet to the KB since our Button module doesn’t support a transparent background button with solid background on hover.

Few things could be wrong. Make sure you set a background color then change the button type to transparent. Also don’t forget placing a class to your button module. This should also apply to Callout modules if you place the same class as well.

The icon class wouldn’t matter in this case. :slight_smile: