Question

以下是示例：

  <table>
    <tr>
    <td style="background: lightgreen; vertical-align: middle">
      <button type="button">b1</button>
    </td>
    <td style="background: yellow; vertical-align: middle">
      <button type="button">b2</button>
        <textarea cols="40" rows="2"></textarea>
    </td>
    </tr>
  </table>

这是JSFiddle链接：http://jsfiddle.net/jhqjumgL/1/

我想这是自我解释，我需要在这里所有按钮垂直居中，但按钮与textarea配对由于某种原因决定在底部休息，任何想法如何解决？

Answer 1

您还需要垂直对齐textarea：

button, textarea {
    vertical-align: middle;
}

小提琴：http://jsfiddle.net/abhitalks/jhqjumgL/2/

Answer 2

vertical-align属性，用于设置元素的垂直对齐方式。

所以，你可以像下面一样垂直地给它元素显示：

button{
   vertical-align : middle;
}

Answer 3

Try this

<table>
    <tr>
        <td style="background: lightgreen;">
      <button type="button">b1</button>
    </td>
        <td style="background: yellow;">
      <button type="button">b2</button>
      <textarea cols="40" rows="2" style="vertical-align: middle"></textarea>
    </td>
    </tr>
  </table>

使按钮在td内垂直居中

3 个答案: