[Footer] How can I create two columns with a heading that resizes properly?

This is what I have so far with the use of two bars (headings and logos)

The issue is every time the screen resizes (image below), the top and bottom bars don’t resize the same amount and on smaller screens they start to overlap.

Is there a way to set a heading with images below stacked in rows? Or would I need to go with html code?

Here is an example of the issue on smaller screens

On a site note - Is there functionality to convert the row into columns i.e. switch the images from landscape to vertical on smaller screens?

This can be deleted - I ended up compromising and created 4 rows (two for larger screen breakpoints and two for smaller screen breakpoints).

Larger screens display two rows while smaller screens display two columns stacked on each other.

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.