JSFiddle - React, Tailwind, and code Playground
HTML
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<h3 class="first"><a class="collapsed filter-head" role="button" data-toggle="collapse" href="#instrument" aria-expanded="false" aria-controls="instrument"><span class="sone">Instrument</span></a></h3>
<div class="collapse" id="instrument">
<div class="well">
<form id="max200">
<div class="checkbox"><label><input type="checkbox" value="">1 Piano, 4 Hands <span class="badge pull-right">49</span></label> </div>
<div class="checkbox"><label><input type="checkbox" value="">Accordion <span class="badge pull-right">40</span> </label></div>
<div class="checkbox"><label><input type="checkbox" value="">Acoustic Guitar <span class="badge pull-right">1</span></label> </div>
<div class="checkbox"><label><input type="checkbox" value="">Alto <span class="badge pull-right">2</span> </label> </div>
<div class="checkbox"><label><input type="checkbox" value="">Alto Sax <span class="badge pull-right">5</span> </label> </div>
<div class="checkbox"><label><input type="checkbox" value="">Alto Saxophone <span class="badge pull-right">56</span> </label></div>
<div class="checkbox"><label><input type="checkbox" value="">Alto/Tenor Saxophone Duet <span class="badge pull-right">1</span> </label></div>
<div class="checkbox"><label><input type="checkbox" value="">Band with Choir <span class="badge pull-right">2</span> </label></div>
<div class="checkbox"><label><input type="checkbox" value="">Baritone <span class="badge pull-right">3</span> </label></div>
<div class="checkbox"><label><input type="checkbox" value="">Baritone Sax <span class="badge pull-right">6</span> </label></div>
<div...
CSS
.collapse.in, .collapse{
}
#max200 {
height: 200px;
overflow-y: scroll;
}