Horizontally and vertically aligned containers in footer

[riugn557]

Hi there,

On this page https://thelanguagesherpa.com in mobile view you can see that I have two container which are currently horizontally aligned.

I would like to add a third container but I want this container to sit underneath the first two.

Do you know how I can do this?

Thank you!
LS

[christian]

Hey LS,

The easiest setup to achieve this is to add a second bar.

Having 3 containers and set the last one at the bottom above the 2 containers is a bit complex. You will need to understand Flexbox for that. See https://theme.co/apex/forum/t/using-flexbox/24851

Thanks.

[riugn557]

Hi Christian,

The only thing is that I want the social icons to go over the background image I have (with the mountain and purple sky). If I make the social icons go into a separate bar, this means that it would have to have a difference background as well, wouldn’t it?

[friech]

Hi There,

In that case, place all your Containers on the same Bar.

Then set your Bar to wrap children

Then set your 3rd Container’s Flex Basis to 100%

The other two containers should have the same SELF FLEX configuration so they are equal.

V2 Elements Tips & Tricks: Flexbox

Hope it helps,
Cheers!