Footer Design Help

Hello all,

Does anyone know why my footer has a white line underneath it, on the left side? On all pages except for the home page, easier to see on mobile.

Cant seem to figure out what’s causing it

Thanks in advance.

https://preview.webflow.com/preview/wdjc?preview=19e0e44e0db755bb4a6dc40808d9dd7a

Hey @Conor_Maurice
Flexbox to the rescue.

More info about flexbox. Happy designing!

Hi @Conor_Maurice

You could use Flexbox instead of rows with parent div set to Align Stretch then the two columns for social icons will stretch to fill the vertical space.

image

Nothing wrong with sticking to the way you’ve done it though. The reason you’re getting the line is because the row symbol for social isn’t wrapped in a Div as it is on the homepage, this means the left column is showing the light background from behind as it doesn’t fill the same height as the right column. Checkout your homepage navigator (where it is correct) to see the difference in structure of the other pages…

image

If you move the symbol for ‘Social’ into a Div Block with the class you used on Homepage (Content. Footer) then it will work. Personally I would remove the symbol you have created and set it to the parent div Content.Footer and then add back into each page.

Hope that makes sense!

1 Like

Understood, thanks very much for the help both!

1 Like