I am building a website and have a hover over menu in the upper left corner.
When viewed on my Windows 11 PC it operates as intended. The menu items are listed vertically in a droo-down. However, when viewed on my cell phone (save Opera browser) the menu items are listed horizontally and are not in a hover over drop-down. How can I fix the phone functionality?
Hello, its going to be hit or miss unless you open up desktop view on your phone, that being said do you have your meta viewport code in the head of the HTML?
not sure what Meta Viewport code is, so probably not…
You can look at some source code till you come across it, or just google.
Its basically another meta tag making things automatically change with the device.
We have to see your code. Post a repo or something like Codepen.
Does it work in other browsers on your phone? I believe older versions of Opera Mobile (12.1) very often has unsupported features. The latest version should be fine, I think (80).
https://caniuse.com/?compare=op_mob+12.1,op_mob+80&compareCats=all
1 Like
It was the browser! Opera Beta doesn’t behave as expected but the regular Opera does as well as other browsers I tried. THANK YOU! I have updated the beta version but that did not help unfortunately…
I had my wife try it on her iPhone and hers did not work as intended. She couldn’t tell me what browser name she was using. But suffice it to say it’s apparently not just a problem with the Opera Beta as I don’t believe she was using that browser.
It is impossible for us to help you without seeing the code.
How are you switching between the navs. I assume you have a vertical nav for larger viewports and a mobile nav for narrow viewports. If you are using a media query, how did you write it? For example, if you are using Range Syntax, that is only supported in newer browser and not supported at all in others.
https://caniuse.com/?search=media%20query%20range%20features
If it works on some mobile devices with some browsers, chances are the issue is with the device or browser. So it is reasonable to assume some kind of lack of support for some CSS feature used.