Question: I am using angularjs ngtable module to create this table. 

Here is the relevant html code;

```
<div ng-controller="TestCtrl" class="container">
    <table ng-table="tableParams" class="table table-bordered">
        <thead>
        <tr>
            <th>name</th>
            <th>remarks</th>
        </tr>
        </thead>

        <tbody>
        <tr ng-repeat="test in $data">
            <td data-title="'name'" >
                {{test.name}}
            </td>
            <td data-title="'remarks'">
                {{test.remarks}}
            </td>
        </tr>
        </tbody>
    </table>
</div>

```

The `name` string happens to be very short. Sometimes, it is at most 5 characters. Sometimes, at most 3 characters. The column width for `name` is usually wider than necessary. How to make this column fit just nice?

Answer: 
You can make it with css. Add an extra class to your table e.g. `table-expand`

so your table will be 

```
<table ng-table="tableParams" class="table table-bordered table-expand">

```

and the css for this class

```
.table-expand tbody tr td:nth-child(1n) {
    white-space:nowrap;
}

.table-expand tbody tr td:nth-child(2n) {
    width:100%
}

```

see this [demo](https://jsfiddle.net/7woanugh/1/)
If you want to make the width of the column dependent on the content of `test.name`, determine the number of characters in the longest name and set the width of the column based on character count.

**JS**

```
$scope.data = [
    {name: 'a', remarks: 'remark a'},
    {name: 'b', remarks: 'remark b'},
    {name: 'c', remarks: 'remark c'},
    {name: 'defghijk', remarks: 'remark c'}
  ];

  var maxLength = $scope.data.sort(function (a, b) { 
    return (b.name.length - a.name.length); 
  })[0];

  $scope.width = maxLength.name.length * 10 + 'px'

```

**HTML**

```
<div ng-app class="container">
    <table ng-controller="TestCtrl" class="table table-bordered" >
        <thead>
            <tr>
                <th width={{width}}>name</th>
                <th>remarks</th>
            </tr>

        </thead>
        <tbody>
            <tr ng-repeat="test in data">
                <td data-title="'name'" >
                    {{test.name}}
                </td>
                <td data-title="'remarks'">
                    {{test.remarks}}
                </td>
            </tr>
        </tbody>
    </table>
</div>

```

Here's a [working demo](http://jsfiddle.net/brettdewoody/8s2720zh/).