0

我正在使用 Bootstrap 2.2.1 版。我创建了一个带有表格的网页。该表占容器的整个宽度 (100%)。但是，在不同大小的窗口之间，表格的反应不同。

请参阅附图以了解我的问题。

在此处输入图像描述

这是表格的代码

<table id="item-table" class="table table-striped">
    <thead>
        <tr>
            <th style="text-align: center; vertical-align: middle; width: 4%;"></th>
            <th style="text-align: center; vertical-align: middle; width: 14%;">Product</th>
            <th style="text-align: center; vertical-align: middle; width: 11%;">Source Type</th>
            <th style="text-align: center; vertical-align: middle; width: 17%;">Source Location</th>
            <th style="text-align: center; vertical-align: middle; width: 7%;">Rental Quantity</th>
            <th style="text-align: center; vertical-align: middle; width: 7%;">Consigned Quantity</th>
            <th style="text-align: center; vertical-align: middle; width: 11%;">Destination Type</th>
            <th style="text-align: center; vertical-align: middle; width: 17%;">Destination Location</th>
            <th style="text-align: center; vertical-align: middle; width: 12%;">Price</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td style="text-align: center;"><input class="specs-value" type="hidden" name="specs[]" value=""><a class="trigger-remove_item" href="javascript:void();"><i class="icon-adt_trash"></i></a></td>
            <td>
                <select name="model_id[]" class="trigger-model_id span12">
                    <option value="" selected="selected">Select a product in the list</option>
                </select>
            </td>
            <td>
                <select name="source_type[]" class="trigger-source_destination_type span12" data-action_type="0"><option value="0">T.B.D.</option><option value="1" selected="selected">Warehouse</option><option value="2">Show</option></select>
            </td>
            <td>
                <select name="source_id[]" class="span12">
                    <option value="2" selected="selected">High Tech Handling</option>
                    <option value="1">Montreal</option>
                </select>
            </td>
            <td>
                <input name="quantity_rental[]" type="text" value="0" class="span12"></td><td><input name="quantity_consigned[]" type="text" value="0" class="span12"></td><td><select name="destination_type[]" class="trigger-source_destination_type span12" data-action_type="1"><option value="0">T.B.D.</option><option value="1" selected="selected">Warehouse</option><option value="2">Show</option></select>
            </td>
            <td>
                <select name="destination_id[]" class="span12">
                    <option value="2" selected="selected">High Tech Handling</option>
                    <option value="1">Montreal</option>
                </select>
            </td>
            <td><input name="price[]" type="text" value="0.00" class="span12"></td>
        </tr>
        <tr>
            <td colspan="9"><a class="item-add" href="javascript:void();">Add an item to the contract</a></td>
        </tr>
    </tbody>
</table>
4

1 回答 1

0 
span12

我猜什么都没做。尝试删除它们，然后可能会强制表扩展th %它。

我会span2在一些较小的数字框中添加或 4。

在这里做了一些改变......试试看，告诉我它是否能解决问题。 http://jsfiddle.net/TWQ4S/3/

于 2013-05-15T10:51:39.627 回答