JSFiddle - React, Tailwind, and code Playground
HTML
<script src="http://code.jquery.com/ui/1.9.1/jquery-ui.js"></script>
<script src="https://raw.github.com/gfranko/jquery.selectBoxIt.js/master/src/javascripts/jquery.selectBoxIt.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.1.0/bootstrap.min.js"></script>
<select id="testSelectBoxIt" class="small-dropdown">
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
<option>6</option>
<option>7</option>
<option>8</option>
<option>9</option>
<option>10</option>
<option>11</option>
<option>12</option>
<option>13</option>
<option>14</option>
<option>15</option>
</select>
<select>
<option>Long Text</option>
<option>Very Long Text</option>
<option>Very Very Long Text</option>
<option>Very Very Long Long Text</option>
<option>Very Very Very Very Very Very Long Long Long Long Text</option>
</select>
<select>
<option>Hello</option>
<option>World</option>
<option>Foo</option>
<option>Bar</option>
</select>
CSS
@import url('http://twitter.github.com/bootstrap/assets/css/bootstrap.css');
@import url('http://gregfranko.com/jquery.selectBoxIt.js/css/jquery.selectboxit.css');
body {
margin: 0;
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
font-size: 12px;
line-height: 16px;
color: #daa520;
}
.small-dropdown.selectboxit, .small-dropdown.selectboxit + .selectboxit-options{
width: 50px;
min-width: 50px;
}
#testSelectBoxIt{
width: 200px;
}
JavaScript
$(function() {
$('select').selectBoxIt();
});