[Resolved] Pushing to the bottom of the columns

[Hasan]

Hi!

How can I push the price boxes to the bottom of the grid columns, so that all the columns become the same height for the desktop?

Thanks!

[Elvin]

Hi,

I see you’re using GenerateBlocks.

Try this:

Add equal-content-height CSS classes to all of your Grid Blocks w/ price boxes on its advanced settings.

You then add this CSS code.

.equal-content-height > .gb-grid-column > .gb-container > .gb-inside-container {
height: inherit;
display:flex;
flex-direction: column;
}

Here’s how to add CSS – https://docs.generatepress.com/article/adding-css/

I’ve also noticed that you where adding “push-to-bottom” CSS class to some of the price boxes. Continue adding them to all of the price boxes and then add this CSS code:

.push-to-bottom{
margin-top: auto;
}

This should push the price box to the bottom.

[Hasan]

Perfect! Thanks!!

[Elvin]

Perfect! Thanks!!

Nice one. No problem. 🙂

[Author]

Posts