Align buttons to bottom

This topic contains 1 reply, has 2 voices, and was last updated by  Sebastian 1 month ago.

Author Posts

eno812

Can you point me to some training or give me a start on how I can align the buttons on this page of my site Customerpath.com.au. It’s the next row under the hero row.


Sebastian

Hey, this is a tricky one due to the amount of nested flexbox divs. I tried a few things without success, and eventually landed on the following as a working solution. It involves creating a grid layout instead of flexbox, and then using absolute positioning to align the buttons at the bottom.

You need to create 3 custom selectors with the following styles:

.fl-node-5c382fe40eeac {
    display: grid;
    grid: auto / 1fr 1fr 1fr;
}

.fl-node-5c382fe40eee7 {
    width: 100%;
    position: relative;
    padding-bottom: 40px;
}

.fl-node-5c382fe40eeac .fl-cta-button {
    position: absolute;
    bottom: 0;
    width: 100%;
}

I hope that helps!

Cheers,
Sebastian

You must login or register to reply to this topic.