bootstrap:table落后于边界

时间:2012-08-21 12:13:58

标签: twitter-bootstrap

我正在尝试在一个模态内的一个井内制作表格。这是一段代码:

<div class="modal-body">
<form class="form-horizontal">
    <form class="well form-inline">
        <label><h5>rtu</h5></label>
        <table class="table table-bordered">
            <tr>
                <th>mid</th>
                <th>type</th>
                <th>inverce</th>
                <th>mbaddr</th>
                <th>din_reg_offset</th>
                <th>din_type</th>
                <th>dout_reg_offset</th>
                <th>dout_type</th>
                <th>ain_reg_offset</th>
                <th>ain_type</th>
                <th>aout_reg_offset</th>
                <th>aout_type</th>
                <th>float_type</th>
            </tr>
            <tr>
                <td><input type="text" id="mid"></td>
                <td><input type="text" id="type"></td>
                <td><input type="text" id="inverce"></td>
                <td><input type="text" id="mbaddr"></td>
                <td><input type="text" id="din_reg_offset"></td>
                <td><input type="text" id="din_type"></td>
                <td><input type="text" id="dout_reg_offset"></td>
                <td><input type="text" id="dout_type"></td>
                <td><input type="text" id="ain_reg_offset"></td>
                <td><input type="text" id="ain_type"></td>
                <td><input type="text" id="aout_reg_offset"></td>
                <td><input type="text" id="aout_type"></td>
                <td><input type="text" id="float_type"></td>
            </tr> 
        </table>
    </form>
</form>

但桌子不适合井的边界。像这样: enter image description here

但我想要这样的事情: enter image description here 我做错了什么? 感谢。

2 个答案:

答案 0 :(得分:0)

您的表格标记不正确。它应该遵循这种格式。

<table>
 <tr>
  <th>Month</th>
  <th>Savings</th>
 </tr>
 <tr>
  <td>January</td>
  <td>$100</td>
 </tr>
</table>

(来自http://www.w3schools.com/tags/tag_table.asp

答案 1 :(得分:0)

您可以在输入上使用class="input-mini"class="input-small"来缩小输入。但是,您的表格将始终具有固定的最小宽度,其中包含您的输入,well将根据其周围的内容调整大小。您可能仍会在小型浏览器窗口中遇到问题。