Почему не отображается прокрутка в моем списке?

Question

У меня есть этот пример:

link

КОД HTML:

<div class="col-xs-12 col-sm-3 no-padding space-col-app text-left" id="appoi_time"> 
     <label>Time:</label> 
     <input type="text" name="time" id="time" readonly="" onclick="$('#select_time').show();"> 

     <div id="select_time" > 
      <ul> 
       <li onclick="jQuery('#time').val('06:00')">06:00</li> 
       <li onclick="jQuery('#time').val('06:15')">06:15 </li> 
       <li onclick="jQuery('#time').val('06:30')">06:00</li> 
       <li onclick="jQuery('#time').val('06:45')">06:15 </li> 
       <li onclick="jQuery('#time').val('07:00')">06:00</li> 
       <li onclick="jQuery('#time').val('07:15')">06:15 </li>             
       <li onclick="jQuery('#time').val('07:30')">06:00</li> 
       <li onclick="jQuery('#time').val('07:45')">06:15 </li> 
       <li onclick="jQuery('#time').val('08:00')">06:00</li> 
       <li onclick="jQuery('#time').val('08:15')">06:15 </li> 
       <li onclick="jQuery('#time').val('08:30')">06:00</li> 
       <li onclick="jQuery('#time').val('08:45')">06:15 </li> 
       <li onclick="jQuery('#time').val('09:00')">06:00</li> 
       <li onclick="jQuery('#time').val('09:15')">06:15 </li>             
       <li onclick="jQuery('#time').val('09:30')">06:00</li> 
       <li onclick="jQuery('#time').val('09:45')">06:15 </li>               
      </ul> 
</div> 

То, что я хочу сделать, это поставить на полосе прокрутки всегда есть элемент select_time

В это время прокрутка не появляется, пока вы не ... Я хочу всегда отображаться.

Я поставил изображение более четко понять, что я имею в виду.

Как я могу получить свиток для отображения всегда? Вы можете помочь мне решить эту проблему, пожалуйста?

Спасибо заранее!

Answer 1

в вашем CSS высота макияж: авто, и удалить переполнение-у, так CSS становится ниже

#select_time{ 
height:auto; 
border:1px solid #ccc; 
display:none; 
position:absolute; 
background:white; 
top:63px; 
width:100%; 
z-index:99999; 
}