Header & Footer not responsive

After creating a footer and a header with footer/headerbuilder I face the problem that they are not responsive.

I have a bar with 3 containers each. But the single containers are not below each other in the mobile view.

Bar has just a „Content Max Length“ of 1170px. Containers inside have a „Fill Space“

The content-area is responsive.

May you can have a look what I mean?


Thank you!

Hi There,

On each bar, container or element on the header build you have a customize tab.

On this customized tab, you can find the hide based on screen size option.

I recommend you hiding the bar you have created and creating a new one for portrait tablets and mobile.

Hope it helps

I don’t know if this is the meaning of responsive design to create a second footer and header or hide something for tablets and mobiles. I mean it’s a really nice feature to build special things for different devices. But a choise if I want to use this would be nice. I also don’t build a second content area - because this is responsive.

Anyway, it wasn’t that much work because there wasn’t that much content but I’ll have it in my mind for next projects.
Thank you.

You’re welcome! There are elements that aren’t good for other devices even if they are responsive. So yes, you’ll still need to use the visibility options to hide them from a specific device. Example, an inline navigation isn’t good for mobile, so you’ll have to hide it from mobile and add navigation collapse (hidden from desktop), so you have a mobile menu.

Thanks!