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

i using bootstrap , have part in code is:

<table class="table">...</table> 

in header, have tag <meta name="viewport" content="width=device-width"> works fine(i can see whole table on website) when add <meta name="viewport" content="width=device-width initial-scale=1"> suggested on many websites, table doesn't fit 320 px width viewport have been using test , have scroll see whole table.

further investigation , playing around css .table shows can't manually set width below 385 px. have tried searching "bootstrap table 385 px" doesn't seem there special number wondering why table can't smaller. have ideas how can make table smaller or make scale correctly 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="...">&nbsp;{{...}}       </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 "..." in places. i'm not sure if we're allowed post exact code publicly. enough see what's going wrong though.

here, should 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="...">&nbsp;{{...}}       </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>