[Resolved] Post archive containers the same height, button aligned bottom

[Tan]

Hi there,

I’ve viewed the guide here but the CSS suggestions haven’t worked in my scenario.

My site is here.

Would you help me? Thank you.

[Fernando]

Hi Tan,

CSS for alignment varies for every structure. One CSS that works for another site may not work for yours.

Give the parent Container Block holding everything a class of set-container-full-height. Then try adding this CSS in Appearance > Customize > Additional CSS:

.gb-container.set-container-full-height, .gb-container.set-container-full-height > .gb-inside-container {
    height: 100%;
}

.gb-container.set-container-full-height > .gb-inside-container {
    display: flex;
    flex-direction: column;
}

.gb-container.set-container-full-height > .gb-inside-container > .gb-container {
    flex: 1 1 auto;
}

.gb-container.set-container-full-height > .gb-inside-container > .gb-container > .gb-inside-container {
    height: 100%;
    display: flex;
    flex-direction: column;
}

.gb-container.set-container-full-height > .gb-inside-container > .gb-container > .gb-inside-container > :last-child {
    margin-top: auto;
}

[Tan]

Hi Fernando,

Thank you for your help. It worked like a charm! 🙂

[Fernando]

You’re welcome Tan! 🙂

[Author]

Posts