Need help for responsive table

I am developing responsive site in asp. In the site, some pages has data tables in it which are coded by tag <asp:GridView>. I have tried different responsive table css to make this data table responsive. But not getting required output. Thanks in advance.

Maybe this will give you an idea to experiment with…

I am making a responsive site using Twitter Bootstrap and it has a large table. The responsive part worked well until the screen width got in the range of some smaller phones. At that point, the table just extended itself off the side of the page. So I had to shrink the text for the small phone sizes. Here is how I did it:

This CSS link was added as the last CSS link in the page Head…
<link href=“…/assets/css/small-phone.css” rel=“stylesheet”>

…and this file named small-phone.css was created:
/* reformats Tool Selector table for small phones */
@media screen and (max-width: 540px) {
.table th, .table td {
font-size: 9px;
text-align: center; } }

For some reason I don’t understand, it did not work to put this little bit of CSS code into my main CSS file. It only worked when it was by itself (: