Twitter Bootstrap scrolling dropdown-menu
How to style the dropdown menu so that it scrolls
HTML
<div class="container">
<div id="thing">
<div class="btn-group">
<a class="btn dropdown-toggle" data-toggle="dropdown" href="#">
<span>Short List</span>
<span class="caret"></span>
</a>
<ul class="dropdown-menu">
<li><a href="#">Item 1</a></li>
<li><a href="#">Item 2</a></li>
<li><a href="#">Item 3</a></li>
<li><a href="#">Item 4</a></li>
</ul>
</div>
<div class="btn-group">
<a class="btn dropdown-toggle" data-toggle="dropdown" href="#">
<span>Long List</span>
<span class="caret"></span>
</a>
<ul class="dropdown-menu">
<li><a href="#">Item 1</a></li>
<li><a href="#">Item 2</a></li>
<li><a href="#">Item 3</a></li>
<li><a href="#">Item 4</a></li>
<li><a href="#">Item 5</a></li>
<li><a href="#">Item 6</a></li>
<li><a href="#">Item 7</a></li>
<li><a href="#">Item 8</a></li>
<li><a href="#">Item 9</a></li>
<li><a href="#">Item 10</a></li>
<li><a href="#">Item 11</a></li>
<li><a href="#">Item 12</a></li>
<li><a href="#">Item 13</a></li>
<li><a href="#">Item 14</a></li>
<li><a href="#">Item 15</a></li>
<li><a href="#">Item 16</a></li>
<li><a href="#">Item 17</a></li>
<li><a href="#">Item 18</a></li>
<li><a href="#">Item 19</a></li>
<li><a href="#">Item 20</a></li>
<li><a href="#">Item 21</a></li>
...
CSS
@import url('http://twitter.github.com/bootstrap/assets/css/bootstrap.css');
.container {
margin: 10px;
}
#thing .dropdown-menu {
overflow-y: auto;
max-height: 200px;
}