Javascript 如果浏览器调整大小，如何使我的选择框在固定页脚中溢出

我的问题是当我的浏览器调整大小时，页脚和我的选择框如此接近，下拉列表被页脚覆盖。我希望我的页脚中的下拉列表溢出

电流输出：

页脚：

<nav class="navbar navbar-default navbar-fixed-bottom myFooter" role="navigation">
        <div class="container">
            <p class="navbar-text pull-left">My Fixed Footer</p>
        </div>
    </nav>  

---

删除与

size

属性冲突的

onmousedown

和

onchange

处理程序，它将正常工作：

<select name="month" lass="btn btn-default" id="bmonth">
    <option value="">Month</option>
</select>
<select name="day" class="btn btn-default" id="bday">
    <option value="">Day</option>
</select>
<select name="year" class="btn btn-default" id="byear">
    <option value="">Year</option>
</select>

月
白天
年

试试：

.myFooter { overflow: hidden;}

或/及

.dateWrap { height: 32px; margin-bottom: 1.0em; }

反而

.dateWrap { height: 32px; overflow: visible; margin-bottom: 1.0em; }

---

mousedown和onchange的目的是在单击时使dropdown列表变短。@Rory，那么我们如何为change/mousedown添加侦听器呢？我通过使用jquery应用事件来更新您的fiddle，它显示了相同的问题

.dateWrap { height: 32px; overflow: visible; margin-bottom: 1.0em; }