645959 - zooming and scrolling impossible at one.ubuntu.com

Status: RESOLVED WONTFIX

(Firefox for Android Graveyard :: General, defect)

Description

[Uwe Kaminski]

User-Agent:       Mozilla/5.0 (X11; U; Linux i686; en-US; rv:1.9.2.3) Gecko/20100423 Ubuntu/10.04 (lucid) Firefox/3.6.3
Build Identifier: Nightly build from 2011-03-29

If you visit one.ubuntu.com in portrait mode you will be unable to reach the sign in button. And even if you are logged in you will not be able to edit notes because zooming and scrolling is impossible.

Reproducible: Always

Steps to Reproduce:
1. Open http://one.ubuntu.com in portrait mode 
2. Log in with an existing account

Actual Results:  
Log in kink is not reachable

Expected Results:  
Link should be reachable by scrolling to the right side

Comment 1

[Uwe Kaminski]

I forgot to say that I am usiing fennec on Android 2.2 on a Desire Z

Comment 2

[Naoki Hirata :nhirata (please use needinfo instead of cc)]

Also occurs for me in landscape as well as portrait with :

Mozilla/5.0 (Android; Linux armv71; rv2.0b13pre) Gecko/20110328 Firefox/4.0b13pre Fennec/4.1a1pre
Device: Droid 2 
OS: Android 2.2

Comment 3

[Martijn Wargers (dead)]

Attachment: testcase

In the simplified case, this is happening on that site.
Because Fennec doesn't have a screen width of 1000px, you don't see the text with the testcase (the same happens for Firefox, if you make the window smaller).

Comment 4

[Martijn Wargers (dead)]

On the Ubuntu site, stuff is more complicated. There is this css rule that causes trouble:
@media screen and (max-width:800px){
.wrap{width:100%;}
}

This is causing the content to disappear with Fennec.
But you can see the same problem creeping up with Firefox and Google Chrome, when making the window smaller than 800px on that site.

So I guess you could say this is more or less invalid or a tech evangelism issue (the site uses wrong css).

Except, I've noticed that the stock Android browser shows the testcase just fine that I've attached to this bug. It doesn't show the website fine, but after zooming out, it's showing the website fine, too.


Here seems to be a good explanation of what is going on here:
http://stackoverflow.com/questions/4196146/why-do-android-and-ios-browser-render-site-wider-than-the-device-screen-width-by

Perhaps Fennec should be having a default viewport of 980px too in this case?

If the site would have added this meta-tag, things would render just fine in Fennec: <meta name="viewport" content="width=980">

Comment 5

[Martijn Wargers (dead)]

Vivian, I think I talked to you about this bug (or with Matt?).
From what I understood, Fennec has a default viewport of 800px and if the page doesn't fit into that width, then the used viewport is widened to 980px (Safari's mobile browser's viewport width).
In this case that is going wrong, because of the css @media rule used on this site.

Is there something that could be changed in Fennec that makes this site look better?

Comment 6

[BMO Automation]

Closing all opened bug in a graveyard component