TBODY scrolling/rendering extremely slow when cells contain overflow-x:hidden content




13 years ago
9 years ago


(Reporter: juergen, Unassigned)



Windows XP

Firefox Tracking Flags

(Not tracked)



(4 attachments)



13 years ago
User-Agent:       Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.8) Gecko/20051111 Firefox/1.5
Build Identifier: Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.8) Gecko/20051111 Firefox/1.5

A TABLE with fixed height and scrollable TBODY scrolls extremely slow when the cells each contain a DIV with "overflow-x" set to "hidden".

Reproducible: Always

Steps to Reproduce:
1.Create a TABLE with fixed height.
2.Create TBODY, TRs and TDs. Each TD contains a DIV.
3.Set the style for the DIV to cut overflowing content (overflow-x:hidden).
4.Open in Firefox and scroll table content.
Actual Results:  
Table scolls extremely slow and gets much slower when more columns are added. The provided testcase with 200 rows scrolls too slow to be useful even on a 3GHz machine.

Expected Results:  
Scrolling should be much faster and should not be that much dependent on row count.

This seems to be caused by the overflow-x in the DIVs and by only the TBODY being scrollable. If one places the table with variable size inside another DIV of fixed height and makes this DIV scrollable than scrolling will be much faster. However this is not an option since the THEAD is supposed to stay in place. Also I would like to skip the DIVs completely but having overflow-x in the TDs does not work at all. We need this for our web applications.

Comment 1

13 years ago
Created attachment 204344 [details]

The testcase contains a table with 400 rows.
Component: GFX → Layout
Keywords: testcase
Assignee: general → nobody
QA Contact: ian → layout

Comment 2

12 years ago
The scrolling TBODY is not a problem. I will upload a testcase without it which is still slow. And I will upload a testcase without overflow-x in the table cells which is fast.
Also this bug being unconfirmed and open for almost a year now is very disappointing.

Comment 3

12 years ago
Created attachment 240005 [details]
Testcase 2, same as Testcase but without scrolling TBODY.

Comment 4

12 years ago
Created attachment 240006 [details]
Testcase 3, same as Testcase 2 but without overflow-x in table cell.
Thanks for the testcase.
I can see the bug with current trunk build, so confirmed.
I think this would be improved/fixed by the patch for bug 352093.
Depends on: 352093
Ever confirmed: true

Comment 6

12 years ago
Ok, I found the culprit. Switch from overflow-x to overflow and it gets speedy. Now this I never would have guessed.

Comment 7

12 years ago
Created attachment 240012 [details]
Testcase 4, same as Testcase 2 but with overflow instead of overflow-x

Comment 8

12 years ago
Mozilla/5.0 (Macintosh; U; Intel Mac OS X; en-US; rv: Gecko/20070515 Firefox/

Able to reproduce.  Had this problem with a slow scrolling HTML report generated in Micrsoft Reporting Services.

Remove the overflow-x CSS and report scrolls perfectly, but renders slightly differently.  Change 'overflow-x' CSS to 'overflow', renders identically but scrolls quickly.

I thought overflow-x was IE only?  What is difference between overflow-x and overflow CSS properties?  They seem to render identically.

Bug 358936 is a duplicate of this bug.
Duplicate of this bug: 358936
Comment 5 is right.  "overflow-x: hidden" implies "overflow-y: auto", which leads to creation of a child widget.  Just using overflow:hidden doesn't create widgets.

Comment 11

9 years ago
This was fixed by bug 352093.
Last Resolved: 9 years ago
Resolution: --- → FIXED
You need to log in before you can comment on or make changes to this bug.