Text in italics using imported font is distorted when scrolling page

UNCONFIRMED
Unassigned

Status

()

Core
Layout: Text
UNCONFIRMED
6 years ago
a year ago

People

(Reporter: Dan Weiss, Unassigned)

Tracking

14 Branch
x86
Windows XP
Points:
---

Firefox Tracking Flags

(Not tracked)

Details

Attachments

(2 attachments)

(Reporter)

Description

6 years ago
Created attachment 624605 [details]
distorted_text.png

User Agent: Mozilla/5.0 (Windows NT 5.1; rv:14.0) Gecko/20120516 Firefox/14.0a2
Build ID: 20120516042006

Steps to reproduce:

I was browsing the page: http://femicom.org/collection/familytraineraerobicsstudio.html
It uses an imported font named "Lato".


Actual results:

When I scroll the page up slowly, using the scrollbar or touchpad scroll, and expose the text, the text is distorted in appearance.
The italic text is being rendered as if the left origin is reset to 0 each time it incrementally draws more of the text.

When I scroll quickly, using the arrow keys with smooth scrolling disabled, the text is drawn correctly.


Expected results:

The text should be rendered properly.
Can you attach a screenshot of what this looks like in Chrome and IE?
Component: Untriaged → General
QA Contact: untriaged → general

Updated

6 years ago
Component: General → Layout: Text
Product: Firefox → Core
QA Contact: general → layout.fonts-and-text
(Reporter)

Comment 2

6 years ago
Found another page which demonstrates the bug:
http://www.cultofmac.com/167323/huge-shocker-men-love-the-zooey-deschanel-iphone-ad/
And I don't think there are imported fonts on that page.

Screenshots:
http://i.imgur.com/9nuNs.png  bad version, slowly exposed text while slowly scrolling up
http://i.imgur.com/2TwBg.png  good version, when the entire text is drawn at once

Scrolling upward very slowly using the scroll bars to expose the text is the easiest way to see this problem.

Comment 3

a year ago
Created attachment 8819613 [details]
distorted italic text after slow scrolling

Comment 4

a year ago
Problem still exists in Firefox 50.1.0 running on Windows 10 (build ID 20161208153507). I can't reproduce it on my Ubuntu install so it should be a Windows-specific rendering issue.

Here's another page with the issue:
http://www.howardforums.com/showthread.php/1888794-Verizon-Wireless-Exclusive-Google-Pixel-carrier

From the few times I've come across this problem, it seems to occur on italic text nested within multiple layers of div elements. I can reproduce this every time on affected pages scrolling through italic text that runs past the bottom of the window. However it's not clear what combination of styles and divs causes it to occur.

Here's another forum using a similar layout that doesn't distort, at least on my machine:
http://www.flyertalk.com/forum/united-airlines-mileageplus/1802527-introducing-basic-economy.html
You need to log in before you can comment on or make changes to this bug.