UserAgent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_12_5) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/58.0.3029.110 Safari/537.36

Steps to reproduce the problem:
1. View index.html (attached) or http://codepen.io/tannerhodges/pen/VbqpaG on a device with a retina screen.
2. See the red offset on the right side of the sticky "Header" element (see attached: actual-behavior-chrome-58.0.3029.110.png).

If you have multiple monitors, you can drag the Chrome tab between a retina and non-retina monitor and see the offset appear and disappear like this: https://www.dropbox.com/s/v8poeg5wr4ctr5b/2017-05-22-position-sticky-compare-retina-vs-non-retina-offset.mp4?dl=0

What is the expected behavior?
The sticky "Header" element should span the full width of the page (see attached: expected-behavior-safari-10.1.1.png). It renders correctly in Safari 10+ and Firefox 53+.

What went wrong?
The sticky "Header" element is rendered too far to the left.

If you inspect the element, the computed position is listed correctly as `top: 0; left: 0;` but the graphic is rendered as though it had a negative left value (see attached: inspect-element-chrome-58.0.3029.110.png).

The offset seems to be related to the sibling element's transform and filter properties. For example, you can affect the offset by changing the `.hero__image` value of `transform: scale(1.1);` to 1.2, 1.3, etc., or by changing `filter: blur(10px);` to 20px, 30px, etc.

The offset disappears if you do any of the following:

- Remove `min-height` from `.page-wrapper` (issue only appears when body is taller than viewport)
- Remove `transform` from `.page-wrapper`
- Remove `transform` and `filter` from `.hero__image`

Did this work before? No 

Does this work in other browsers? Yes

Chrome version: 58.0.3029.110  Channel: stable
OS Version: OS X 10.12.5
Flash Version: Shockwave Flash 25.0 r0

This issue may be related to these other bugs:

- "Position sticky has incorrect offsets when other elements have certain CSS property values" https://bugs.chromium.org/p/chromium/issues/detail?id=695729
- "incorrect behavior for sticky-positioned element on retina display" https://bugs.chromium.org/p/chromium/issues/detail?id=712774
 

Deleted: index.html 1.3 KB

index.html 1.3 KB View Download

Deleted: expected-behavior-safari-10.1.1.png 11.3 KB

	expected-behavior-safari-10.1.1.png 11.3 KB View Download

Deleted: actual-behavior-chrome-58.0.3029.110.png 12.7 KB

	actual-behavior-chrome-58.0.3029.110.png 12.7 KB View Download

Deleted: inspect-element-chrome-58.0.3029.110.png 41.7 KB

	inspect-element-chrome-58.0.3029.110.png 41.7 KB View Download