Open Radar

 
Summary:
It seems that WebKit/Safari places position:fixed elements incorrectly when they do not have a left/right/top/bottom property set on them and are a child of an element that is position:relative;left:X%;

See the attached screenshots. Safari renders the example differently from Chrome. IE11 and Firefox give the same result as Chrome.

Steps to Reproduce:
1. Open http://jsbin.com/rohemer in OS X Safari or iOS Safari.
2. Look at the red paragraph's text.

Expected Results:
The red paragraph's text makes sense because all of its text is visible.

Actual Results:
The red paragraph's text doesn't quite make sense, because part of it isn't visible.

Version:
The problem occurs on both OS X and iOS, and with WebKit Nightly.
OS X Safari version: 8.0.7 (10600.7.12)
WebKit Nightly version: r186963
OS X version: Yosemite
iOS version: 8.4

Notes:
WebKit bug: https://bugs.webkit.org/show_bug.cgi?id=147284
Possibly related to: https://bugs.webkit.org/show_bug.cgi?id=122878
Original Bootstrap issue: https://github.com/twbs/bootstrap/issues/16814

Configuration:


Attachments:
'safari-wrong.png', 'chrome-correct.png' and 'testcase.html' were successfully uploaded.