Fixed header not fixed on mobile view

[thisazlife]

I have a website http://ts4mo.com that has a fixed header. When I view it on my PC the fixed header stays at the top of the page but when I view it on my mobile phone the header floats with other content out of view as I scroll down through the website. TIA

[crispy68]

One thing I noticed is why are you using 'affix' for the responsive menu when you have the menu inside a fixed layout grid? If the layout grid is fixed to the top, there is no need for the menu to use affix since it is inside the grid. Maybe these 2 are conflicting each other? It also looks like you have some objects or something not right as there is a horizontal scrollbar and I can swipe it horizontally.

If need be, please provide a demo project file (.wbs) so we can look at it.

[thisazlife]

I don't know how to provide a demo project, do I email it somewhere?

[crispy68]

1. create a folder. Call it demo (or whatever you want)
2. save your project in this folder.
3. Open this folder and confirm you see (1) project file (.wbs) and (2) images folder which has the images for your project
4. zip this folder
5. upload it to your server (or some other file sharing site) and provide the link to it (ex: www.mysite.com/demo.zip)

[thisazlife]

Thank you.
https://1drv.ms/u/s!Ai_oka6yXs-TgQwvw61 ... L?e=g14ChO

[Pablo]

For me, the sticky header works on my iPhone.
Maybe your mobile browser does not support 'sticky'?

This is a relatively new HTML feature, so not all browsers do support this:
https://caniuse.com/#feat=css-sticky

[thisazlife]

Thank you. I've added another zip file for review. This wbs does not contain sticky and I'm having the same issue; the header is fixed on PC but not on mobile. Also another user "Crispy68" pointed out that there is a horizontal scroll bar on mobile, where does that come from? TIA!

ts4mo.no.sticky.zip
https://1drv.ms/u/s!Ai_oka6yXs-TtwWaPx8 ... 9?e=cumpef

[Pablo]

Did you read my comments?

Also another user "Crispy68" pointed out that there is a horizontal scroll bar on mobile,

This indicates that there are objects outside the viewport.
See the FAQ:
viewtopic.php?f=10&t=63817

[thisazlife]

I did read your comment. I'll review my site again but so far I'm not finding any differences between sites I have that do work and this one that doesn't.
Thanks for your help.

[alan_sh]

You could try and click "render hidden objects" in the View menu and see if there's anything there.

Alan

[Pablo]

I was referring to:

For me, the sticky header works on my iPhone.
Maybe your mobile browser does not support 'sticky'?

This is a relatively new HTML feature, so not all browsers do support this:
https://caniuse.com/#feat=css-sticky

[thisazlife]

Thank you. I ended up just creating a new website and this time the sticky works and there isn't a horizontal scroll bar on mobile. I never could figure out what was wrong with the other site.

[zinc]

Have seen this?

https://www.wysiwygwebbuilder.com/forum ... 53&t=63391

[thisazlife]

I have a website http://ts4mo.com that has a fixed header. When I view it on my PC the fixed header stays at the top of the page but when I view it on my mobile phone the header floats with other content out of view as I scroll down through the website. TIA

I was able to resolve this issue by reviewing Object Manager and removing any stray objects out of range.