Webkit is ignoring overflow-x: completely

• Component: CSS
• Status: RESOLVED WORKSFORME

I've tried the following in safari 6.1.6 on 10.8.5 as well as the latest webkit nightly r173508. I've set up two samples. In the first the overflowing pseudo element part (blue) should be hidden 

http://codepen.io/rpkoller/pen/buAHm 

while in the second the overflowing part of the grey div should be hidden. 

http://codepen.io/rpkoller/pen/DjmsI

In both cases if you click with the mouse and keep it clicked and move it to the right the page is scrolled horizontally and the initially hidden overflow is shown. The overflow on the right side for the red pseudo element  is hidden properly and impossible to scroll. But on the right  webkit is ignoring the overflow-x property completely. The first pen is tested in: 

Safari: not working
Webkit nightly: not working
Chrome: not working
Opera: not working
opera next: not working
Firefox: working as expected.

[Alexey Proskuryakov]

I don't see any difference in rendering between a current nightly and Firefox 32.

(In reply to comment #1)
> I don't see any difference in rendering between a current nightly and Firefox 32.

I've created brief screencasts for each browser showing the issue: 

https://dl.dropboxusercontent.com/u/8578/overflowx_safari.mov
https://dl.dropboxusercontent.com/u/8578/overflowx_webkitnightly.mov
https://dl.dropboxusercontent.com/u/8578/overflowx_chrome.mov
https://dl.dropboxusercontent.com/u/8578/overflowx_opera.mov
https://dl.dropboxusercontent.com/u/8578/overflowx_operanext.mov
https://dl.dropboxusercontent.com/u/8578/overflowx_firefox.mov

all created with the following pen: http://codepen.io/rpkoller/pen/buAHm

[Brent Fulgham]

Safari, Chrome, and Firefox all agree on rendering for this test case. I don't believe there is any remaining compatibility issue.