Make multiple-select to adjust its height to fit options without scroll bar

html css html-select
Alex picture Alex · Mar 30, 2012 · Viewed 167.6k times · Source

Apparently this doesn't work:

   select[multiple]{
     height: 100%;
   }

it makes the select have 100% page height...

auto doesn't work either, I still get the vertical scrollbar.

Any other ideas?

enter image description here

Answer

Alex picture Alex · Sep 25, 2012

I guess you can use the size attribute. It works in all recent browsers.

<select name="courses" multiple="multiple" size="30" style="height: 100%;">

Related questions

How do I make a placeholder for a 'select' box?

I'm using placeholders for text inputs which is working out just fine. But I'd like to use a placeholder for my selectboxes as well. Of course I can just use this code: <select> <option value="">Select …

Read More
Change select box option background color

I have a select box and I'm trying to change the background color of the options when the select box has been clicked and shows all the options. See Fiddle HTML: <select> <option val="">Please choose&…

Read More
How to use Checkbox inside Select Option

The client has given me a design which has a Select Option menu containing a checkbox together with the item name as individual items in the list. Is there anyway possible to add a checkbox inside a Select Option menu? …

Read More