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一起破解它，但如果内容增长它会变得更糟。

＆＃13;

<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>

＆＃13;

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

1 个答案: