Created attachment 257494 [details] Screenshot of incorrect Safari rendering OS X Safari version: 8.0.7 (10600.7.12) WebKit Nightly version: r186963 OS X version: Yosemite iOS version: 8.4 Possibly related to: https://bugs.webkit.org/show_bug.cgi?id=122878 Original Bootstrap issue: https://github.com/twbs/bootstrap/issues/16814 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. To reproduce: 1. Open http://jsbin.com/rohemer in OS X Safari or iOS Safari. 2. Look at the red paragraph's text. Actual result: The red paragraph's text doesn't quite make sense, because part of it isn't visible. Expected result: The red paragraph's text makes sense because all of its text is visible.
Created attachment 257495 [details] Screenshot of correct rendering from Chrome for comparison
Created attachment 257496 [details] Copy of testcase webpage (in case JS Bin goes down)
Also filed a Radar for this: <rdar://problem/21993128>
Only happens when the position:fixed has 'auto' left.
There are now tests for this in the CSS2 test suite: http://test.csswg.org/harness/test/css21_dev/single/left-offset-position-fixed-001/ http://test.csswg.org/harness/test/css21_dev/single/right-offset-position-fixed-001/
Created attachment 268137 [details] Test reduction
Created attachment 268247 [details] Patch
Comment on attachment 268247 [details] Patch View in context: https://bugs.webkit.org/attachment.cgi?id=268247&action=review > Source/WebCore/rendering/RenderBox.cpp:3358 > + const auto& renderBox = downcast<RenderBox>(*current); > + staticPosition -= renderBox.logicalLeft(); > + if (renderBox.isInFlowPositioned()) > + staticPosition -= renderBox.relativePositionOffset().width(); Would it make sense to have an accessor that return renderBox.logicalLeft() + renderBox.relativePositionOffset().width() for in-flow-positioned?
Created attachment 268466 [details] Patch
Comment on attachment 268466 [details] Patch Clearing flags on attachment: 268466 Committed r194710: <http://trac.webkit.org/changeset/194710>
All reviewed patches have been landed. Closing bug.
Thank you! Removed the entry from Bootstrap's wall: https://github.com/twbs/bootstrap/commit/6ab9e10efa9b3a195d5df26d9b901deaa3437cad
(In reply to comment #12) > Thank you! > Removed the entry from Bootstrap's wall: > https://github.com/twbs/bootstrap/commit/ > 6ab9e10efa9b3a195d5df26d9b901deaa3437cad Thanks for reporting it!