[Resolved] Aliging within a container

[Erika]

Hi there,

probably a very basic question…

I´d like to align the two child containers in the parent container with “align-content: stretch”. I added the parent conatiner a class and this css:
.flextopdown {
display:flex;
flex-direction:column;
align-items: stretch;
}

But I do not get the expected result. Why?

Basically the outer container unter the image should be the same height as the image and I´d like the button be at the bottom, regardless how much text is above (stretch).

Maybe there is even a setting that would reach this without css, I just can´t find?

Thanks, Erika

[Ying]

Hi Erika,

Try this CSS:

.flextopdown {
    display:flex;
}
.flextopdown >.gb-inside-container {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

[Erika]

Thank you, Ying, works nicely. Erika

[Ying]

You are welcome 🙂

[Author]

Posts