Small white line with box-shadow and double scaling (transform)

NEW
Unassigned

Status

()

Core
Layout: View Rendering
6 years ago
4 years ago

People

(Reporter: Arjan, Unassigned)

Tracking

11 Branch
x86_64
Windows 7
Points:
---

Firefox Tracking Flags

(Not tracked)

Details

Attachments

(2 attachments, 3 obsolete attachments)

60.66 KB, image/png
Details
882 bytes, text/html
Details
(Reporter)

Description

6 years ago
Created attachment 575753 [details]
testcase.html

User Agent: Mozilla/5.0 (Windows NT 6.1; WOW64; rv:11.0a1) Gecko/20111120 Firefox/11.0a1
Build ID: 20111120031001

Steps to reproduce:

Mozilla/5.0 (Windows NT 6.1; WOW64; rv:11.0a1) Gecko/20111120 Firefox/11.0a1

Wrote a simple testcase with:

1. a -moz-transform acting twice on the same element
2. Limiting the width of this element (by width or position:absolute)
3. Applied box-shadow


Actual results:

A small white line appeared between the box shadow and the element


Expected results:

No white line between the element and box shadow, like Opera and Chrome
(Reporter)

Comment 1

6 years ago
Created attachment 575754 [details]
Testcase as text/html
Attachment #575753 - Attachment is obsolete: true
(Reporter)

Comment 2

6 years ago
Created attachment 575755 [details]
Screen shot of issue

Screen shot of the problem. 

Somehow i was unable to upload the testcase as text/html..
(Reporter)

Updated

6 years ago
Attachment #575754 - Attachment mime type: text/plain → text/html
Component: Layout: Block and Inline → Layout: View Rendering
QA Contact: layout.block-and-inline → layout.view-rendering
(Reporter)

Comment 3

6 years ago
Created attachment 575873 [details]
Simplified testcase

Simplified the testcase. Seems to be depended on the width of the window (resizing the window can make the bug appear / disappear)

Furthermore, it seems that centering the element causes it. (margin: auto or <center>). 

The transform:scale factor does not seem to have any influence next to showing the bug in the first place.
Attachment #575754 - Attachment is obsolete: true
(Reporter)

Updated

6 years ago
Attachment #575873 - Attachment mime type: text/plain → text/html
(Reporter)

Comment 4

6 years ago
Created attachment 576430 [details]
Beter testcase

Even beter testcase, showing that the bug also appears in the height. Seems to be dependend on percentage margin calculation, as with pixel based marging it works
Attachment #575873 - Attachment is obsolete: true
(Reporter)

Updated

6 years ago
Attachment #576430 - Attachment description: Beter screenshot → Beter testcase
Attachment #576430 - Attachment mime type: text/plain → text/html
Status: UNCONFIRMED → NEW
Ever confirmed: true

Comment 5

4 years ago
I've come across this as well, with maybe a slightly simpler use-case. See this jsfiddle:

http://jsfiddle.net/2cSmS/1/

It happens with just a box-shadow and transform:scale - but it seems to depend on the width of the element and the amount that it is scaled.
You need to log in before you can comment on or make changes to this bug.