Button Text Alignment

When using the button to use the “Fill Horizontal Space” the text and icon are center aligned and cant figure out how to make them left aligned. I am using them in a grid, so adjusted the settings there. But also using them in a widget outside a grid and same problem.

Hi @465media,

Give the Button wrapper a class of btn-align-left then, add this in Appearance > Customize > Additonal CSS:

.gb-button-wrapper.btn-align-left .gb-button {
    justify-content: flex-start;
    padding-left:  20px;
}

Thanks, I will give that a shot, not sure why its not able to do that within the settings.

You’re welcome!

The alignment of the text of the buttons is determined by the paddings by default. When you enable the Fill Horizontal Space, the buttons automatically center by default which is the ideal position of most users with such a layout.

The team is considering more alignment/possibilities with GB Blocks though for the future.