Ответ 1
Вы можете сделать <select> 100% высоты <form>, которая содержит его.
См. эту скрипту для примера div, в котором находится форма, с выбором, заполняющим высоту формы.
Это начинается с простой структуры, достаточно, чтобы форма была заключена во что-то, чтобы вы могли видеть относительный макет.
<div>
<form>
<select id="thelist" size="4">
<option value="1">One</option>
<option value="2">Two</option>
<option value="3">Three</option>
<option value="4">Four</option>
</select>
</form>
</div>
Я даю div высоту, фон, чтобы вы могли ее видеть, и заполнение, чтобы контент, естественно, не покрывал его. Сделайте форму любой высоты, которую вы хотите, в том числе 100% от div. Я сделал это на 90%, поэтому вы все еще можете видеть прилагаемый div. Обратите внимание, что ширина формы заполняет ширину div, кроме заполнения.
Затем вы можете просто установить высоту списка выбора на все, что хотите внутри формы. Здесь мой CSS
div {
background-color: #fff0f0;
height: 40em;
padding: 1.5em 1.5em 0 1.5em;
}
form {
background-color: #f0f0f0;
height: 90%;
}
#thelist {
height: 100%;
}
Поместите вместе как фрагмент и уменьшите его, чтобы он лучше поместился здесь...
div {
background-color: #fff0f0;
height: 20em;
padding: 1.5em 1.5em 0 1.5em;
}
form {
background-color: #f0f0f0;
height: 40%;
}
#thelist {
height: 100%;
}<div>
<form>
<select id="thelist" size="4">
<option value="1">One</option>
<option value="2">Two</option>
<option value="3">Three</option>
<option value="4">Four</option>
</select>
</form>
</div>