Vertical scroll in Select html

Question

Can you have a vertical scroll in select html,,,

But keeping size="1" So when you click on the drop list it displays only around 5 options and the rest are viewed when you scroll.

I have a fiddel here

form name="#">

 <div class="select-style2"> 

     <select  size="1" autocomplete="off">

<option hidden value="#">title</option>
<option value="#">2</option>
<option value="#">3 </option>
<option value="#">4 </option>
<option value="#">5 </option>
<option value="#">6 </option>
<option value="#">7 </option>
<option value="#">8 </option>
<option value="#">9 </option>
<option value="#">10 </option>




</select>
</div>
<input type="button" name="test" value="Go"
onClick="go()" id="btn">

I'd love an example where that'd happen, but I can understand :) — Ali Gajani, Jun 09 '14 at 07:48
I have my reasons, one being design !!, and two the list is around 20. — BEN ANDERSEN, Jun 09 '14 at 09:38

score 1 · Answer 1 · answered Jun 09 '14 at 08:05

As a previous answer points out, there isn't good styling options for select dropdowns.

However, the good news is, the answer to your question "Can you have a vertical scroll in select html" is yes. It's there by default when you have enough options in the list. But changing that number seems impossible with css.

See demo here: http://jsfiddle.net/VxNV9/1/

But you could create a custom drop down in jquery/javascript and style it however you want.

score 0 · Answer 2 · edited May 23 '17 at 10:26

0

It is not possible to do in HTML. In SO, they have already discussed about this. Check It out Here.

May be there are other ways of achiving this through javascript or jQuery, with links on that page to some jQuery plugins which create a "fake" html select box that looks and behaves like one, but can have the height set.

edited May 23 '17 at 10:26

Community

1
1

answered Jun 09 '14 at 07:53

Suresh Ponnukalai

13,820
5
34
54

Vertical scroll in Select html

2 Answers2

Linked