如何使用Twitter Bootstrap在TD中垂直对齐按钮,文本和输入文本字段

Question

<tr>
  <td colspan="3">
        With Selected: 
    <select name="action" id="group_action" class="span2">
      <option value="">--Choose--</option>
      <option value="delete">Delete</option>
      <option value="add_to">Add To</option>
    </select> 
    <select name="group" id="group">
      <option value="">--Choose--</option>
    <?php foreach($groups as $group){ ?>
  <option value="<?php echo $group->id?>"><?php echo $group->name?></option>
  <?php } ?>
  </select> 
    <button name="group_action" class="btn">Submit</button>
  </td>

</tr>

我已经尝试style="vertical-align:middle", valign="middle"过TD,但它不起作用

这是它的样子:http://ge.tt/1Klf2dS/v/0？c

Answer 1

Twitter引导程序将添加margin-bottom: 10px到大多数表单元素,但不添加到<button>元素.如果放置在表的单行中,这将导致HTML元素看起来奇怪对齐.

您可以从元素中删除margin-bottom,也可以将其添加到其他元素中.

看看这个例子:

http://jsbin.com/ezunom/1/edit