HTML / CSS-将表格行中的文本框居中对齐，文字如下

Question

我正在尝试找出如何在不向上推文本框的情况下在表格行的居中输入框下方对齐文本。

这是我的桌子：

<table border="1">
    <tr>
        <th>One</th>
        <th colspan="2">Info</th>
    </tr>
    <tr>
        <td rowspan="4">
            <input type="text" value="" />
            <br/> Test
            <br/> Test2
        </td>
        <th>Something</th>
    </tr>
    <tr>
        <td>
            Blah
        </td>
    </tr>
    <tr>
        <td>
            Blah
        </td>
    </tr>
    <tr>
        <td>
            Blah
        </td>
    </tr>
</table>

Jsfiddle展示了我的意思

我想垂直对齐文本框使其居中，同时文本显示在其下方，并且不向上推文本框

Answer 1

像这样？

编辑-这很困难，您可以使用padding-top将其合并在一起，但是如果内容增加，它将变得更糟。

 <table border="1"> <tr> <th>One</th> <th colspan="2">Info</th> </tr> <tr> <td valign="middle" rowspan="4" style="padding-top:10%;"> <input type="text" value="" /> <br> asdf <br>asdf </td> <th>Something</th> </tr> <tr> <td> Blah </td> </tr> <tr> <td> Blah </td> </tr> <tr> <td> Blah </td> </tr> </table>