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

Question

Apparently this doesn\'t work:

   select[multiple]{
     height: 100%;
   }

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

auto

Answer 1

Old, but this will do what you're after without need for jquery. The hidden overflow gets rid of the scrollbar, and the javascript makes it the right size.

foo
bar
abc
def
xyz

And just a tiny amount of javascript

var select = document.getElementById('select');
select.size = select.length;