how can I make sure a dropdownlist's list is always dropped down rather than up

问题

I want to show dropdownlist always to down. (Is it posible?)

If bottom space is less then the height of dropdown list it's show list to up.

I want to show list always to down.

Thanks in advance

回答1:

This can be achieved by adding the following attribute to your CSS class of your dropdown list:

.drop-down {
    top:100%; 
}

The same can be used to force the list to go upwards: bottom: 100%;

Here is a jsfiddle demo.

---

EDIT:

The standard HTML form Select Option (<select><option> <option></select>) can not be manipulated to expand into a certain direction. You'll have to write your own custom dropdown menu with JavaScript to implement this functionality.

After a quick browse I've noticed that others have struggled with the problem you're having. And apparently the following CSS code seems to fix it in some cases.

select { vertical-align: top; }

回答2:

What you can do is set the attr size using jQuery like so

jsFiddle : https://jsfiddle.net/ou5n9u3y/

jQuery

$(function () {
    var dropdownOptions = $('.dropdown-selector').find('option').length;
    $('.dropdown-selector').attr('size', dropdownOptions);
});

来源：https://stackoverflow.com/questions/32579795/how-can-i-make-sure-a-dropdownlists-list-is-always-dropped-down-rather-than-up