Fixed Button Placement in 3 Column Layout

Sorry, I didn't mean that the page section would be different.

Each site may have a *completely* different layout, and the code might not work at all.

On your page, its the page-section above the block with the buttons (the button link is the red arrow).

Ok, thank you. I think I'll have to figure out a different way to either do this or find another design so I can replicate it for multiple client sites. Appreciate your assistance.

1 hour ago, IraBro said:

Hi,

I would like to have all buttons below the text blocks in 3 columns on the same fixed height. Now they are getting mixed up and each button got a different place, according to the text length. I used spacers, but if my text blocks don't all have the same amount of text, they get a different height. Anybody that can help me with the css to be applied to these specific text blocks /buttons or how to fix this?

Website: www.groepspraktijkoudenaarde.be

Password: Berchemweg5

Have you solved this yet?

Hi @tuanphan,

Just wondering if you can help me with the same issue?

I want to align the 3 buttons at the bottom of the 3 columns on this page, each column has different length of copy. I have looked at the posts above but I am struggling to apply it to my site:

https://gazelle-beagle-h4me.squarespace.com/get-started

Screenshot attached.

Password is : clearskin

Appreciate your advice, thanks you!

On 1/26/2021 at 9:38 PM, obrienleeanne said:

Hi @tuanphan,

Just wondering if you can help me with the same issue?

I want to align the 3 buttons at the bottom of the 3 columns on this page, each column has different length of copy. I have looked at the posts above but I am struggling to apply it to my site:

https://gazelle-beagle-h4me.squarespace.com/get-started

Screenshot attached.

Password is : clearskin

Appreciate your advice, thanks you!

It looks like you solved with

@media screen and (min-width: 768px) {
    div#block-fb84f98cad829c056d6d+.row {
        display:flex
    }

    div#block-fb84f98cad829c056d6d+.row .span-4 {
        position: relative;
        padding-bottom: 100px
    }

    div#block-fb84f98cad829c056d6d+.row .button-block {
        position: absolute;
        bottom: 0;
        left: 50%;
        transform: translatex(-50%);
        width: 100%
    }
}