Question

<table>
<tr>
    <td>
        random text here
        <textarea value=""></textarea>
    </td>
</tr>
</table>

在浏览器中，文字位于底部。如何使其成为中心或顶部？ TD上的垂直对齐似乎不起作用。

Answer 1

文本沿着一条线呈现。内联元素（例如textarea）也在该行上呈现。

文本位于表格单元格的底部，因为它位于textarea所在的同一行上，而textarea占据了单元格的整个高度。

您想要更改该行上textarea的位置，但您可以这样做：

textarea {
    vertical-align: middle; /* other values are available */
}

Answer 2

gathcea：

您可以将文字放在上面一行：

<table>
    <tr>
      <td> 
        <p>random text here</p>
      </td>
    </tr>
    <tr>
      <td>
        <textarea value=""></textarea>
      </td>
    </tr>
</table>

或使用换行符将文本区域置于其下方：

<table>
    <tr>
      <td>
        <p>random text here</p>
        <br />
        <textarea value=""></textarea>
      </td>
    </tr>
</table>

为什么文本会沉到表格单元格的底部？

2 个答案: