Archived topic

vertical align button to bottom

5 replies · Started by Jeroen on November 23, 2020

Viewing posts 1–6 of 6

November 23, 2020 at 8:27 am #1542645

Hi,
I'm trying the following in generatepress / generateblocks, to have a grid of two columns, each with a paragraph and a button below. Is it possible somehow to vertical align the buttons to the bottom of the grid? So they appear at the same absolute height?
Jeroen

November 23, 2020 at 11:47 am #1542915

Hi there,

No built-in option for this yet but we could likely do that with some CSS.

Any chance you can link us to the site in question?

You can use the private information field.

Let me know :)

November 23, 2020 at 1:16 pm #1543051

Hi Leo, thank you for taking a look :-)
At the bottom of the homepage, the black buttons should be (bottom) aligned. I could set them in a new container / grid below the paragraphs for desktop, but then it would not go well on tablet / mobile. Maybe it's not difficult but I can't come up with the proper solution.
Jeroen

November 23, 2020 at 1:40 pm #1543065

Hi,

You can try this CSS:

.gb-container-dc9bea3e .gb-inside-container {
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    height: 100%;
}
.gb-button-wrapper.gb-button-wrapper-a75ddd8d {
    margin-top: auto;
}

Applying this would have this result: https://share.getcloudapp.com/Koulml9K

November 23, 2020 at 11:20 pm #1543558

Hi Elvin
Thank you, that worked!
Auto margin on a flex child, useful :-)

November 24, 2020 at 11:37 am #1544973

Hi Elvin
Thank you, that worked!
Auto margin on a flex child, useful 🙂

Yes it definitely is.:)

No problem. Glad it works for you. :D

This archived topic is closed to new replies.

Start building better websites today.