如何在开发类中插入滚动条

我想在代码的下拉列表中添加一个滚动条。它实际上是一个购物车，当我点击购物车时，它会显示购物车中的项目。我想在它上面放一个滚动条，向下看上面的项目，因为下拉框有固定的大小。

我用于购物车的代码是：

<ul id="cart-dropdown" class="box-dropdown parent-arrow">
<li>
<div class="box-wrapper parent-border">
<p>Recently added item(s)</p>
<table class="cart-table">
<tr>
<td><img src="img/products/sample1.jpg" alt="product"></td>
<td>
<h6>Lorem ipsum dolor</h6>
<p>Product code PSBJ3</p>
</td>
<td>
<span class="quantity"><span class="light">1 x</span> $79.00</span>
<a href="#" class="parent-color">Remove</a>
</td>
</tr>
<tr>
<td><img src="img/products/sample1.jpg" alt="product"></td>
<td>
<h6>Lorem ipsum dolor</h6>
<p>Product code PSBJ3</p>
</td>
<td>
<span class="quantity"><span class="light">1 x</span> $79.00</span>
<a href="#" class="parent-color">Remove</a>
</td>
</tr>
<tr>
<td><img src="img/products/sample1.jpg" alt="product"></td>
<td>
<h6>Lorem ipsum dolor</h6>
<p>Product code PSBJ3</p>
</td>
<td>
<span class="quantity"><span class="light">1 x</span> $79.00</span>
 <a href="#" class="parent-color">Remove</a>
 </td>
  </tr>
 </table>
<br class="clearfix">
 </div>                                            
<div class="footer">
<table class="checkout-table pull-right">
<tr>
<td class="align-right">Tax:</td>
 <td>$0.00</td>
</tr>
<tr>
<td class="align-right">Discount:</td>
 <td>$37.00</td>
</tr>
 <tr>
<td class="align-right"><strong>Total:</strong></td>
<td><strong class="parent-color">$999.00</strong></td>
 </tr>
 </table>
</div>
<div class="box-wrapper no-border">
<a class="button pull-right parent-background" href="#">Checkout</a>
<a class="button pull-right" href="order_info.html">View Cart</a>
</div>
</li>
</ul>