776622 - Webpage menu isn't usable with narrow window, such as Android phone

Status: RESOLVED WORKSFORME

(www.mozilla.org :: General, defect)

Description

[Tommy Trussell]

User Agent: Mozilla/5.0 (X11; Ubuntu; Linux i686; rv:14.0) Gecko/20100101 Firefox/14.0.1
Build ID: 20120713224758

Steps to reproduce:

Followed menus to http://www.mozilla.org/en-US/firefox/mobile/faq/ using Android phone running FireFox 14.0.1. I tried to use the menu in the top left (designated by the thick horizontal lines) was unusable. I confirmed the problem in Firefox in Ubuntu with the window resized to be narrow, and also in Google Chrome with a narrow window.


Actual results:

The menu was unusable -- every time I touched it the menu would appear and then disappear too quickly to use or even see well.


Expected results:

According to one of the commenters at https://support.mozilla.org/en-US/questions/932913 there is "a short change of the #nav-main-menu style attribute, but the change to display: block doesn't last and reverts back to display:none"

The commenter recommended this code in userContent.css to keep the menu open:

@-moz-document domain(www.mozilla.org){
 #nav-main .toggle.open+#nav-main-menu { display:block!important; }
}

I confirmed this works in the Desktop Firefox but I cannot test in Android as I don't know where the userContent.css file might go on my phone.

Comment 2

[Tommy Trussell]

I don't believe this is a duplicate of bug 740941 -- the page RENDERS correctly on my phone, it's just that the menu doesn't work. I am not certain but I believe the description on bug 740941 describes something different.

I also have been supplied with some css that seems to produce acceptable behavior on the menu, though I don't have a way to test it on Android. It works in desktop Firefox.

Note also that two people at https://support.mozilla.org/en-US/questions/932913 have confirmed it and one supplied the css.

Comment 3

[Tommy Trussell]

As suggested in the support site, adding this code to userContent.css keeps the menu open in desktop browsers:

@-moz-document domain(www.mozilla.org){
 #nav-main .toggle.open+#nav-main-menu { display:block!important; }
}


I have no easy way to test it on the Android FireFox. I presume the css could be updated on the Mozilla site to fix the menus for everyone.

Comment 4

[Steven Garrity [:sgarrity]]

I can't replicate this issue - there have been a fairly large number of changes over the past few months. Closing, but please re-open if this is still an issue.