How can I add a scrollbar to a DIV that contains a table?

How can I add a scrollbar to a DIV that contains a table?

I have the following HTML that I am using with browser as new as IE8 and
above:
<div><table class="grid table">
and .css file:
.grid {
clear: both;
border-collapse: collapse;
border-spacing: 0;
width: 100%;
}
This works but when my table is larger than the containing DIV then it
goes offscreen.
How can I make it so a scroll bar allows me to scroll my table to the
right and left if it is too big for the screen?