Open Radar

 
Summary:
In Safari, a <select multiple> with many options and with `padding-right` CSS causes its OS X auto-hiding scrollbar to get clipped when it is displayed. If the `padding-right` is set to a sufficiently large value, the scrollbar gets completely hidden due to the clipping. Note how the scrollbars pointed at by the green arrows in the attached screenshot are different.

Steps to Reproduce:
1. Open http://jsbin.com/fekipo/2/edit?html,output
2. Hover over each <select multiple> and scroll up/down through its options using your mouse wheel
3. While scrolling, observe the scrollbar that's displayed in the <select multiple>

Expected Results:
The scrollbar displayed in both <select multiple>s should be the same width.

Actual Results:
The scrollbar in the <select multiple> with `padding-right` CSS gets partially clipped off and is thus narrower than the correct scrollbar displayed in the normal <select multiple>.

Version:
Safari Version 8.0.1 (10600.2.3)
OS X Yosemite

Notes:
Also filed as https://bugs.webkit.org/show_bug.cgi?id=128489
Chrome and Firefox don't suffer from this problem; their scrollbars work fine in this case.

Configuration:


Attachments:
'clipped.png' was successfully uploaded.