CSS Code for Aligning Button to Center only Extends Button, Doesn't Center

[Armkk]

Hi there,

I’m applying the following under Button / Customize / Inline CSS:

$el {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
margin: auto;
}

But all this does is make the button extend the entire width of the column. How do I make it keep its original size but be center aligned.

Thanks

[ruenel]

Hello Ari,

Thanks for writing in!

The custom css is not necessary. You can align the button to be always at the center by enabling Flexbox option and the Text Align option in your column settings.

• 

Hope this helps.

[Armkk]

Thank you for the information. It worked perfectly.

I found that with the column Flexbox “off”, it only worked if Text Align was centered. But with Flexbox “on”, it gave me a lot more control over what to center and how to do it in the flexbox options.

[rad]

Glad we could always help and you’re most welcome!