How to Get Horizontal Scroll Bar in Select Box in Ie

How to get horizontal scroll bar in select box in IE?

I’m not really sure what you’re trying to achieve. This is simply a select list. Just remove your styling and it will automatically size to your contents.

EDIT

Make the container that contains the list scroll. Note: the usability of this is somewhat questionable so I would look for another solution prior to implementing something like this on a page.

<div id="selector_cat"> 
    <select name="sets">
        <option value="general">happy holiday</option>
        <option value="garden">Garden</option>
        <option value="Lunch">Lunch</option>
        <option value="nice day">A nice day out with my friend on the beach</option>
    </select>
</div>

#selector_cat{
    width: 100px; 
    overflow: auto;
}

Is it possible to add an horizontal scroll bar to an html select box?

As others have said, this is not possible. However, there is no need for a scrollbar on the option list if your goal is simply to make the select small while keeping the options fully visible. If you limit the width of your select through CSS, you will see that the browser automatically makes the whole width of the option list visible.

select { width: 100px; }

Edit: See my previous answer on this topic. Firefox, Chrome, and IE10 will make the option list wider than the select if necessary, but IE9 will not. The other answers to that question link to this question with fixes for old IE: Dropdownlist width in IE.

Related Topics