Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Acid2 not pixel perfect #2035

Open
SimonSapin opened this issue Apr 4, 2014 · 1 comment
Open

Acid2 not pixel perfect #2035

SimonSapin opened this issue Apr 4, 2014 · 1 comment
Labels

Comments

@SimonSapin
Copy link
Member

@SimonSapin SimonSapin commented Apr 4, 2014

This is Gimp’s Difference blend mode of

With commit fe1615b.

diff

The main problem seems to be that scrolling to #top leaves us at a non-integer pixel position, causing anti-aliasing issues. The test because almost pixel-perfect (except the nose that’s 1px off and the eyes that seem to round alpha blending differently than the reference) if I remove this part of the test, with these additional style rules:

.intro { display: none }
#top { margin-top: 0 }
@pcwalton
Copy link
Contributor

@pcwalton pcwalton commented Apr 5, 2014

Yes, layers doesn't currently do pixel snapping. This shows up on other sites as well when scrolling.

Needs to be addressed as part of the layers refactoring.

SimonSapin added a commit to SimonSapin/servo that referenced this issue Jul 1, 2014
The rendering is incorrect, but this should help catch further regressions.

The test is modified to add the following CSS:

    .intro { display: none }
    html #top { margin-top: 0 }

This works around the lack of layer pixel snapping. (See servo#2035)

The reference is modified to match the current rendering of the test:

* Rows 1, 2 (forehead), 4, and 5 (eyes) are missing.
* The yellow background in row 3 overflows by 1px at the bottom.
* The top-right and bottom-left borders of the nose are 1px to high.
* Row 12’s height is 3px more than it should be.
* Rows 13 and 14’s positions are 4px lower than they should be.

(See http://www.webstandards.org/action/acid2/guide/ for row numbers.)

The nose issue seems be related to rounding vs truncating
when pixel-snapping borders, but this is only a guess.

Adding `.chin div { font-size: 3px }` works around the chin issue
(rows 12 to 14) for reasons that escape me yet.
@frewsxcv frewsxcv added the I-wrong label Aug 7, 2015
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Linked pull requests

Successfully merging a pull request may close this issue.

None yet
3 participants
You can’t perform that action at this time.