[Resolved] Possible to Anchor Buttons to bottom of a container within a grid

Home Forums Support [Resolved] Possible to Anchor Buttons to bottom of a container within a grid

Home Forums Support Possible to Anchor Buttons to bottom of a container within a grid

  • This topic has 3 replies, 2 voices, and was last updated 2 years ago by Fernando.
Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #2261791
    Rebecca

    Hello!

    I am working with a four column grid where every column ends with a button. Is there a way to set the last object in a container (in this case a button) to move to the bottom of the container?

    I want the headlines to line up at the top and the buttons to be uniform at the bottom no matter how much text is in the middle of the columns. I am able to get the headlines aligned or the buttons, but never both.

    Thanks!

    #2261815
    Fernando
    Customer Support

    Hi Rebecca,

    Try adding my-grid to the class list of the Grid Block as such: https://share.getcloudapp.com/5zurBeRd

    Then, add this custom CSS in Appearance > Customize > Additional CSS:

    .my-grid > .gb-grid-column > .gb-container > .gb-inside-container {
        display: flex;
        flex-direction: column;
        height:100%;
    }
    
    .my-grid > .gb-grid-column > .gb-container > .gb-inside-container .wp-block-buttons {
        margin-top:auto;
    }

    Kindly let us know how it goes.

    #2262721
    Rebecca

    Works perfectly!

    Thank you so much Fernando.

    #2262768
    Fernando
    Customer Support

    You’re welcome Rebecca! Glad that worked!

Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.