Closed Bug 1151250 Opened 10 years ago Closed 9 years ago

Overflow-x: hidden not working when on body and html

Categories

(Firefox for Android Graveyard :: General, defect)

Product:
Firefox for Android Graveyard
Component:
General
Version:
37 Branch
Platform:
All
Android
Type:
defect
Priority:
Not set
Severity:
normal

Tracking

(Not tracked)

Status:
RESOLVED DUPLICATE of bug 886969

People

(Reporter: u535898, Unassigned)

Details

User Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.10; rv:36.0) Gecko/20100101 Firefox/36.0 Build ID: 20150320202338 Steps to reproduce: Visit any website which uses overflow-x: hidden on the body and/or html. Actual results: Overflow-x when applied to the body and/or html isn't handled properly on Firefox for Android. Users can still scroll horizontally; sometimes in one direction but usually in both Tested on the release, beta and nightly apps. On the other hand, it does work on Firefox for Mac and PC. Expected results: The user shouldn't be able to scroll horizontally when overflow-x used.
An example: http://codepen.io/chriscoyier/pen/PwzBBw
OS: Mac OS X → Android
Hardware: x86 → All
I have encountered the same issue with a Bootstrap 3 off canvas menu. (left) If I apply overflow:hidden to the html and body tags Firefox mobile works as expected. Unfortunately this prevents other browsers from scrolling vertically. (including Firefox desktop) I'll be resorting to using javascript and user agent detection to work around this issue. It's an ugly hack but unavoidable at this time.
Mike/Daniel do you know of this? Looks fairly reduced testcase already.
Flags: needinfo?(miket)
Flags: needinfo?(dholbert)
Given that this is a mobile-specific scrolling thing (only broken on mobile based on comment 0), kats is more likely to know what's going on than I am.
Flags: needinfo?(dholbert) → needinfo?(bugmail.mozilla)
Looks like it, thanks.
Status: UNCONFIRMED → RESOLVED
Closed: 9 years ago
Resolution: --- → DUPLICATE
Flags: needinfo?(bugmail.mozilla)
Flags: needinfo?(miket)

This is still happening in the current (October 26th 2020) version of Firefox... 82.0 (64-bit) is ignoreing overlow and overflow-x values unless they have the old -moz-* value tags that were supposedly retired.

For example:
"overflow-x" in sample 1 is ignored by Firefox 82.
/---- CSS SAMPLE 1 ---/
.grid-view > table > tbody > tr > td {
white-space: nowrap;
overflow-x: hidden;
font-size: 12px;
}

While " overflow-x" in sample 2 is obeyed by Firefox 82.

/---- CSS SAMPLE 2 ---/
.grid-view > table > tbody > tr > td {
white-space: nowrap;
overflow-x: -moz-hidden-unscrollable;
font-size: 12px;
}

Please open a new bug. Commenting in a duplicate bug is not going to get your bug fixed.

Product: Firefox for Android → Firefox for Android Graveyard
You need to log in before you can comment on or make changes to this bug.