Радио внутри TD, неспособное установить ширину - все элементы TD равны ширине и игнорируют стиль ширины

У меня есть таблица с переключателем в элементе td, но я не могу установить ширину (моя страница находится в HTML5, поэтому с помощью атрибута style css задайте ширину).

Моя строка выглядит следующим образом:

<h3><span data-bind="text: description"></span></h3>
<table class="table table-striped table-condensed">
    <thead>
        <tr>
            <th colspan="2">Description</th>
            <th>Setup</th>
            <th>Monthly</th>
        </tr>
    </thead>
    <tbody>
        <!-- ko foreach: options -->
            <tr>
                <td style="width:16px"><input type="radio" data-bind=" attr: { name: $parent.name }, checkedValue: $data, checked: $parent.selection" /></td>
                <td><span data-bind="text: description"></span></td>
                <td><span data-bind="text: setup == 0 ? '-' : setup"></span></td>
                <td><span data-bind="text: price == 0 ? '-' : price"></span></td>
            </tr>
        <!-- /ko -->
    </tbody>
</table>

Фактически все строки имеют ширину 154 пикселя, каждая строка равна.

Не беспокойтесь о атрибутах привязки данных, я использую knockoutjs. Я использую бутстрап для строгих, но не вижу никаких ширины столбцов, применяемых при загрузке CSS.

Ниже снимок экрана:

Изменить и получить дополнительную информацию

После просмотра скрипта из комментария @daker здесь http://jsfiddle.net/g18c/Lnvny/, я видел, что ширина была применена ОК.

При переходе по моему коду у меня есть раздел thead, который вызывает проблему, этого нет в приведенной выше скрипте.

Добавление ниже раздела thead к скрипке останавливает ширину от применения к элементу td, обновляется здесь http://jsfiddle.net/g18c/Lnvny/2/

<thead>
    <tr>
        <th colspan="2">Description</th>
        <th>Setup</th>
        <th>Monthly</th>
    </tr>
</thead>

Если я задал ширину в th-элементе с <th colspan="2" style="width:20px">Description</th>, он будет иметь размеры, поэтому элементы td будут соответствовать ширине td, что имеет смысл.

Однако описание охватывает 2 столбца с colspan="2", который состоит из первого td с радио и второго td с привязкой данных описания текста в тексте.

Есть ли способ сохранить th colspan = 2 в thead, но установите ширину переключателя td = 16px в tbody?

Ответы

<h3><span data-bind="text: description"></span></h3>
<table class="table table-striped table-condensed">
    <thead>
        <tr>
            <th colspan="2">Description</th>
            <th>Setup</th>
            <th>Monthly</th>
        </tr>
    </thead>
    <tbody>
        <!-- ko foreach: options -->
            <tr>
                <td style="width: 15px;"><input type="radio" data-bind=" attr: { name: $parent.name }, checkedValue: $data, checked: $parent.selection" /></td>
                <td style="width: auto;">text<span data-bind="text: description"></span></td>
                <td style="width: 25%;"><span data-bind="text: setup == 0 ? '-' : setup"></span></td>
                <td style="width: 25%;"><span data-bind="text: price == 0 ? '-' : price"></span></td>
            </tr>
        <!-- /ko -->
    </tbody>
</table>

<td style="width: 50%;">
 <input type="radio" data-bind="..." />
 <span data-bind="text: description"></span>
</td>

<td style="width:1px"><div style="width:16px"><input type="radio" data-bind=" attr: { name: $parent.name }, checkedValue: $data, checked: $parent.selection" /></div></td>

<table>
<thead>
    <tr>
        <th colspan="2">Description</th>
        <th>Setup</th>
        <th>Monthly</th>
        <th></th>
    </tr>
</thead>