jQuery bootgrid plugin - setting column width

Question

I have Razor page with a table. All looks fine until I apply jquery bootgrid. Column width become fixed and data is truncated. Column width become fixed and data is truncated.

How can I keep the column width to auto so that data is not truncated ? How can I keep the column width to auto so that data is not truncated ?

  <table id="grid"  class="table table-condensed table-hover table-striped">
            <thead>
                 <tr>
                     <th data-column-id="Nominal">
                         Nominal
                     </th>
                     <th data-column-id="TD">
                        Tradedate / Valuedate
                    </th>
                    <th data-column-id="ReleaseDate">
                        ReleaseDate
                    </th>
                     <th data-column-id="Fund">
                       Fund
                    </th>
                    <th data-column-id="Pre-Pay">
                        Pre-Pay
                    </th>
                    <th data-column-id="Comment">
                        Comment
                    </th>
                </tr>
            </thead>
            <tbody>

                @foreach (var item in Model)
                {
                <tr>
                    <td>
                        @Html.DisplayFor(modelItem => item.Nominal)
                    </td>

                    <td>
                        @Html.DisplayFor(modelItem => item.TD) <br />
                        @Html.DisplayFor(modelItem => item.VD)

                    </td>

                    <td>
                        @Html.DisplayFor(modelItem => item.ReleaseDate)
                    </td>

                    <td>
                        @Html.DisplayFor(modelItem => item.Fund)
                    </td>
                    <td>
                       @Html.DisplayFor(modelItem => item.Pre_Pay)
                    </td>

                    <td>
                        @Html.DisplayFor(modelItem => item.Comment)

                    </td>
                </tr>
                }
            </tbody>
        </table>

    <script type="text/javascript">

            document.addEventListener('DOMContentLoaded', function () {
                $("#grid").bootgrid({
                    caseSensitive: false

                })

            });

        </script>

Answer 1

SOLVED: style = "table-layout: auto;" is what I needed.