我有一个在td元素上有一个单选按钮的表,但是我无法设置宽度(我的页面在
HTML5中,因此使用样式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>
实际上所有的行都是154px宽,每行相等.
不要担心数据绑定属性,我正在使用knockoutjs.我正在使用引导为引导,但不能看到在引导CSS应用的任何列宽度.
我下面是chrome的截图：
编辑和进一步的信息
从@ daker的评论中看过这个小提琴http://jsfiddle.net/g18c/Lnvny/后,我可以看到宽度被应用了.
当我的代码过去时,我有一个导致问题的部分,这不在上面的小提琴中.
将下面的小节添加到小提琴中会阻止在td元素updated here 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”>描述< / th>它的大小,所以td元素跟随td的宽度,这是有道理的.
然而,描述跨越2列,colspan =“2”,由第一个td与radio组成,第二个td与tbody中的文本描述数据绑定.
有没有什么办法可以保留第一个colspan = 2,而在tbody中设置单选按钮的宽度td = 16px？
解决方法
将第二列的宽度设置为auto：
<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 },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>
