Scrollbar of select[multiple] gets clipped by padding-right CSS

Number:rdar://19208483 Date Originated:10-Dec-2014
Status:Closed Resolved:28-May-2016
Product:Safari Product Version:8.0.1 (10600.2.3)
Classification:UI/Usability Reproducible:Always
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,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>.

Safari Version 8.0.1 (10600.2.3)
OS X Yosemite

Also filed as
Chrome and Firefox don't suffer from this problem; their scrollbars work fine in this case.


'clipped.png' was successfully uploaded.


Fixed in WebKit

Fixed by

Please note: Reports posted here will not necessarily be seen by Apple. All problems should be submitted at before they are posted here. Please only post information for Radars that you have filed yourself, and please do not include Apple confidential information in your posts. Thank you!