Заполнять 100% ширины при скрытии столбца

Скрываю столбцы в таблице с помощью jQuery

$("input:checkbox:not(:checked)").each(function() {
var column = "table ." + $(this).attr("name");
$(column).hide();
});

$("input:checkbox").click(function(){
var column = "table ." + $(this).attr("name");
$(column).toggle();

});

Нужно чтобы видемые сьолбцы покрывали 100% таблицы/div'a

Вот сама таблица

<table class="table table-hover" id="test1" style="width: 100%;">
    <thead>
    <tr style="width: 100%" id="checkRow">
        <th style="width:2%" class="id" sortable-heading sort="sort" by="id">ID</th>
        <th style="width:9%" class="name" sortable-heading sort="sort" by="name">
            {{'projects.labels.name' | translate }}
        </th>
        <th style="width:8%" ng-if="!showView" class="company_name" sortable-heading sort="sort"
            by="company_name">
            {{'projects.labels.company_name' | translate }}
        </th>
        <th style="width:6%;" id="city1" class="city" sortable-heading sort="sort" by="city">
            {{'projects.labels.city' | translate }}
        </th>
        <th style="width:4%" id="country" class="country" sortable-heading sort="sort" by="country">
            {{'projects.labels.country' | translate }}
        </th>
        <th style="width:4%" class="start_date" sortable-heading sort="sort" by="start_date">
            {{'projects.labels.start_date' | translate }}
        </th>
        <th style="width:4%" class="employment_type">
            {{'projects.labels.employment_type' | translate }}
        </th>
        <th style="width:4%" class="user_name" sortable-heading sort="sort" by="user_name">
            {{'projects.labels.user_name' | translate }}
        </th>
        <th style="width:4%" class="created_at" sortable-heading sort="sort" by="created_at">
            {{'projects.labels.created_at' | translate }}
        </th>
        <th style="width:4%" class="status_changed_stop" sortable-heading sort="sort" by="project_status_changed_at">
            {{'projects.labels.project_status_changed_at' | translate }}<br>
            /{{'projects.labels.project_status_stop' | translate }}
        </th>
        <th style="width:3%" class="status" sortable-heading sort="sort" by="status">
            {{'projects.labels.status' | translate }}
        </th>
        <th style="width:3%" class="candidates_count" sortable-heading sort="sort" by="candidates_count">
            {{'projects.labels.candidates_count' | translate }}
        </th>
        <th class="days_elapsed" sortable-heading sort="sort" by="days_elapsed">
            {{'projects.labels.days_elapsed' | translate }}
        </th>
        <th  style="width:8%" class="days_remaining" sortable-heading sort="sort" by="days_remaining">
            {{'projects.labels.days_remaining' | translate }}
        </th>
        <th>{{'projects.labels.actions' | translate }}</th>
    </tr>
    </thead>
    <tbody>
    <tr ng-repeat="project in projects">
        <td>
            <i ng-if="::project.invalid" class="fa fa-exclamation-circle" aria-hidden="true"></i>
            {{ ::project.id }}
        </td>
        <td>
            <a ui-sref='projects.show({id: project.id})' href="#">{{::project.name }}</a>
        </td>
        <td ng-if="!showView">
            <a ui-sref='clients.show({id: project.client_id})' href="#">
                {{ ::project.client_name}}
            </a>
        </td>
        <td style="word-break: break-all;">{{ ::project.address.city }}</td>
        <td>{{ 'countries.' + project.address.country | translate }}</td>
        <td>{{ ::project.start_date | date }}</td>
        <td>
            <div ng-repeat="employment_type in ::project.employment_types ">
                <span>{{ 'abr_' +  employment_type.name | translate }}</span>
            </div>
        </td>
        <td tabindex="1">
            <div class="btn-group max" uib-dropdown>
                <button id="single-button" type="button" class="btn btn-default" uib-dropdown-toggle>
                    {{ ::project.supervisors[0].name }} <span class="caret"></span>
                </button>
                <ul class="dropdown-menu" uib-dropdown-menu role="menu" aria-labelledby="single-button">
                    <li ng-repeat="supervisor in project.supervisors" role="menuitem" class="text-center">
                        <a> {{::supervisor.name}} <br>
                            <small>({{ ::supervisor.email }})</small>
                        </a>
                    </li>
                </ul>
            </div>
        </td>
        <td>{{ ::project.created_at | date }}</td>
        <td>{{(project.status != 'open' ? (project.project_status_changed_at | date) : "&dash;") }}</td>
        <td>
            <div ng-switch="project.status">
                <span change-project-status-modal project="project" index="$index" data="projects"
                      ng-switch-when="closed" class="label label-default"
                      can-edit="canEdit(project.concerns_current_user)"
                      ng-class="{pointer: canEdit(project.concerns_current_user) }">
                    {{::project.status | translate }}
                </span>
                <span change-project-status-modal project="project" index="$index" data="projects"
                      ng-switch-when="on-hold" class="label label-warning"
                      can-edit="canEdit(project.concerns_current_user)"
                      ng-class="{pointer: canEdit(project.concerns_current_user)}">
                    {{::project.status | translate }}
                </span>
                <span change-project-status-modal project="project" index="$index" data="projects"
                      ng-switch-when="open" class="label label-success"
                      can-edit="canEdit(project.concerns_current_user)"
                      ng-class="{pointer: canEdit(project.concerns_current_user)}">
                    {{::project.status | translate }}
                </span>

                <span change-project-status-modal project="project" index="$index" data="projects"
                      ng-switch-when="in-progress" class="label label-success"
                      can-edit="canEdit(project.concerns_current_user)"
                      ng-class="{pointer: canEdit(project.concerns_current_user) }">
                    {{::project.status | translate }}
                </span>
                <span change-project-status-modal project="project" index="$index" data="projects"
                      ng-switch-when="to-do" class="label label-default"
                      can-edit="canEdit(project.concerns_current_user)"
                      ng-class="{pointer: canEdit(project.concerns_current_user) }">
                    {{::project.status | translate }}
                </span>
                <span change-project-status-modal project="project" index="$index" data="projects"
                      ng-switch-when="sent-to-client" class="label label-default"
                      can-edit="canEdit(project.concerns_current_user)"
                      ng-class="{pointer: canEdit(project.concerns_current_user) }">
                    {{::project.status | translate }}
                </span>
                <span change-project-status-modal project="project" index="$index" data="projects"
                      ng-switch-when="standing-order" class="label label-default"
                      can-edit="canEdit(project.concerns_current_user)"
                      ng-class="{pointer: canEdit(project.concerns_current_user) }">
                    {{::project.status | translate }}
                </span>
            </div>
        </td>
        <td>
            <a ui-sref="projects.show({id: project.id, tab: 'candidates'})" type="button"
               class="btn btn-default project-count">
                {{::project.candidates_count}}
            </a>
        </td>
        <td>
            <span ng-if="project.status =='open'">
                <timer language="pl" max-time-unit="'day'" start-time="now - project.elapsed_time">
                    {{days}} dni, {{hhours}}:{{mminutes}}h
                </timer>
            </span>
            <span ng-if="project.status !=='open'">
                <static-time elapsed="true" time-stamp="project.elapsed_time"></static-time>
            </span>
        </td>
        <td>
            <span ng-if="project.status =='open'">
                <span ng-class="{overdue: isNegative}">
                    <span ng-if="isNegative">-</span>
                    <timer language="pl" max-time-unit="'day'" allow-negative="true" is-negative="isNegative"
                           end-time="project.remaining_time + now">
                        {{days}} dni, {{hhours}}:{{mminutes}}h
                    </timer>
                </span>
            </span>
            <span ng-if="project.status !=='open'">
                  <static-time time-stamp="project.remaining_time"></static-time>
            </span>
        </td>
        <td>
            <div class="btn-group-vertical">
                <button title="{{'button_titles.add_reminder' | translate }}"
                        add-reminder-modal entity-type="Project"
                        entity-id="{{project.id}}" class="btn btn-info" type="button">
                    <i class="fa fa-calendar-plus-o"></i>
                </button>
                <a title="{{'button_titles.show_project' | translate }}"
                   ui-sref='projects.show({id: project.id})' href="#"
                   class="btn btn-primary" type="button">
                    <i class="glyphicon glyphicon-eye-open"></i>
                </a>
                <a ng-if="canEdit(project.concerns_current_user)"
                   title="{{'button_titles.edit_project' | translate }}"
                   ui-sref='projects.edit({id: project.id})' href="#"
                   class="btn btn-success" type="button">
                    <i class="glyphicon glyphicon-pencil"></i>
                </a>
                <a ng-if="canRemove(project.concerns_current_user)"
                   title="{{'button_titles.delete_project' | translate }}"
                   delete-confirmation-modal type="button" class="btn btn-danger"
                   data-resource-id="{{::project.id}}"
                   data-resource-name="{{::project.name}}"
                   data-resource-index="{{$index}}"
                   data-remove-callback="removeCallback({param: resource})">
                    <i class="glyphicon glyphicon-trash"></i>
                </a>
            </div>
        </td>
    </tr>
    </tbody>
</table>