Hi !
I try to add a search element with “input view” inside a offcanvas mobile menu but it doesn’t works. When I touch the search cell to type, the offcanvas disappear and I can’t see what I’m typing (but if I type “blindly”,the search works fine). It happens only on phone, If I reduce the window on desktop to mimic a phone, everything is fine.
Gooday !
Clem
Hi Clement,
Thanks so much for your report!
Unfortunately, I cannot reproduce the issue. Would you be please provide a live link?
Best regards,
timmse
Of course, I’ll PM you.
Thanks for the link! The slide-up after setting of your sticky header causes the issue. If you place the offcanvas element e.g. in the footer instead of the header, it works as it should.
Related:
Best regards,
timmse
Ok ! A little counter-intuitive but it works, thanks a lot !
About accessibility/html semantic (nav HTML tag, UL…) and google crawl, do you recommend me to wrap that offcanvas menu inside a basic section/div or inside a nav, like it supposed to be if I let it in the right place ?
I am not an accessibility expert, but you shouldn’t go wrong with a nav tag. Alternatively, you can give the div a role=“navigation” attribute.
Source: accessibility - Should I use <aside> for off-canvas navigation? - User Experience Stack Exchange
Ok, great ! So, that way, UX and accessibility are good. 
But what about search engine crawl/SEO ? Isn’t it a issue to have 2 nav elements in same page ? Especially the mobile menu nav in the footer ?
Best regards,
Clement
