JSFiddle - React, Tailwind, and code Playground

HTML

<div id="coursepack">
<div id="facilities" class="chamber">
                    <div class="block">
                    <div class="facilities scrollable"><div>
                        
                        
                        <li class="facility" style="background-position:0px 0px;"><span>Driving Range</span></li>
                        <li class="facility" style="background-position:0px 0px;"><span>Driving Range</span></li>
                        <li class="facility" style="background-position:0px 0px;"><span>Driving Range</span></li>
                        <li class="facility" style="background-position:0px 0px;"><span>Driving Range</span></li>
                        <li class="facility" style="background-position:0px 0px;"><span>Driving Range</span></li>
                        <li class="facility" style="background-position:0px 0px;"><span>Driving Range</span></li>
                        <li class="facility" style="background-position:0px 0px;"><span>Driving Range</span></li>
                        <li class="facility" style="background-position:0px 0px;"><span>Driving Range</span></li>
                        <li class="facility" style="background-position:0px 0px;"><span>Driving Range</span></li>
                        <li class="facility" style="background-position:0px 0px;"><span>Driving Range</span></li>
                        <li class="facility" style="background-position:0px 0px;"><span>Driving Range</span></li>
                        <li class="facility" style="background-position:0px 0px;"><span>Driving Range</span></li>
            
                        
                        
                        <div class="clear"></div> 
                    </div></div>
                    </div>
                    
                </div>
                
</div>

CSS

.scrollable {
    width:100%;
    height:100%;
    overflow:auto;
}
#coursepack .chamber {
    width:908px;
    height:410px;
      color:#FFF;
    position:absolute;
}
#coursepack .chamber .block {
    width:550px;
    height:410px;
    -webkit-border-top-right-radius:10px;
    -webkit-border-bottom-right-radius:10px;
    -moz-border-radius-topright:10px;
    -moz-border-radius-bottomright:10px;
    border-top-right-radius:10px;
    border-bottom-right-radius:10px;
    background-color:#3C3630;
    background: -webkit-linear-gradient(left top, #000000, #403A33, #27231F);
      background: -moz-linear-gradient(left top, #000000, #403A33, #27231F);
      background: -ms-linear-gradient(left top, #000000, #403A33, #27231F);
      background: -o-linear-gradient(left top, #000000, #403A33, #27231F);
      -webkit-box-shadow: 2px 0px 2px #888;
      -moz-box-shadow: 2px 0px 2px #888;
      box-shadow: 2px 0px 2px #888;
      color:#FFF;
      float:left;
      overflow:hidden;
      position:relative;
    z-index:2;
}
#coursepack .facilities {
    padding-left:33px;
    width:510px;
    padding-right:7px;
    overflow:auto;
}
#coursepack .facilities  .facility {
    width:150px;
    height:135px;
    border:1px solid #BBB;
    margin:4px;
    float:left;
    position:relative;
    background:url(http://www.golfbrowser.com/wp-content/themes/GB/images/courses/facilities.jpg) no-repeat;
    display:block;
}
#coursepack .facilities .facility span {
    width:150px;
    position:absolute;
    top:115px;
    line-height:20px;
    height:20px;
    text-align:center;
    color:#FFF;
    font-family:"Myriad Pro", Arial, sans-serif;
    font-size:12px;
    background:#222;
    opacity:0.9;
}