滚动未在具有父滚动div的select元素上触发

Question

所以尽管我试图在网上找到一些东西来回答这个问题，但我没有运气。 我一直在尝试创建一种“大多数”css方法，将水平滚动添加到选择列表中。

但是，如果我在可滚动容器内部选择容器高度小于选择高度（在外部容器上触发垂直滚动），则 滚动 行为 wonky （在正常选择的情况下）或 none （在向{em>添加multiple="multiple"属性的情况下选择）在IE或Chrome中。但是，它似乎在FireFox中正常运行

问题：是否有任何css / html结构可以解决？任何替代的jQuery / js解决方法？

http://jsfiddle.net/Qn6TH/3/

div.ScrollableSelect { overflow: auto; }
#availableCodes { width: 600px; height: 1715px; }

<div class="ScrollableSelect" style="width: 300px; height: 300px">
    <select id="availableCodes" multiple="multiple">
    </select>
</div>