Table width can't be set below 385 pixels and responsiveness issue - html

Question

I am using Bootstrap and have a part in my code that is:
<table class="table">...</table>
In my header, I have the tag <meta name="viewport" content="width=device-width"> This actually works fine(I can see the whole table on my website) but when I add <meta name="viewport" content="width=device-width initial-scale=1"> like is suggested on many websites, my table doesn't fit the 320 px width viewport that I have been using to test and I have to scroll to see the whole table.
Further investigation and playing around with the css for .table shows that I can't manually set width below 385 px. I have tried searching "bootstrap table 385 px" but it doesn't seem like there is anything special about this number so I am wondering why the table can't be smaller. Does anyone have any ideas as to how I can make the table smaller or make it scale correctly to initial-scale=1?
Edit #1:
<table class="table">
<thead>
<tr>
<th>Col1</th>
<th>Col2</th>
<th>Col3</th>
</tr>
</thead>
<tbody>
<tr>
<td>
<input type="checkbox" ng-model="..."> ...
</td>
<td>
<input type="checkbox" ng-model="..."> ...
</td>
<td width=70%>
<input class="form-control" ng-model="...">
</td>
<td>
<button class="btn btn-primary" ng-click="...">...</button>
</td>
</tr>
<tr ng-repeat="... in ...">
<td class="claimedby-{{...}}">
<input type="checkbox" ng-model="..." ng-click="..."> {{...}}
</td>
<td>
<input type="checkbox" ng-model="..." ng-click="..."> ...
</td>
<td>
<div for="...">
<div class="...">{{...}}</div>
</div>
</td>
<td>
<button class="btn btn-danger" ng-click="...">...</button>
</td>
</tr>
</tbody>
</table>
Sorry for the "..." in certain places. I'm not sure if we're allowed to post exact code publicly. Hopefully this is enough to see what's going wrong though.

Answer 1

Here, this should do it for you
<table class="table">
<thead>
<tr>
<th class="col-md-4 col-xs-2">Col1</th>
<th class="col-md-4 col-xs-2">Col2</th>
<th class="col-md-4 col-xs-8">Col3</th>
</tr>
</thead>
<tbody>
<tr>
<td>
<input type="checkbox" ng-model="..."> ...
</td>
<td>
<input type="checkbox" ng-model="..."> ...
</td>
<td>
<input class="form-control" ng-model="...">
</td>
<td>
<button class="btn btn-primary" ng-click="...">...</button>
</td>
</tr>
<tr ng-repeat="... in ...">
<td class="claimedby-{{...}}">
<input type="checkbox" ng-model="..." ng-click="..."> {{...}}
</td>
<td>
<input type="checkbox" ng-model="..." ng-click="..."> ...
</td>
<td>
<div for="...">
<div class="...">{{...}}</div>
</div>
</td>
<td>
<button class="btn btn-danger" ng-click="...">...</button>
</td>
</tr>
</tbody>
</table>