表中垂直对齐?

时间:2011-01-19 15:17:27

标签: html css html-table vertical-alignment

我在表格中有一个对象而且我无法设置垂直对齐(它似乎不起作用)。

为什么?

示例:

http://jsfiddle.net/PHDWz/1/

3 个答案:

答案 0 :(得分:1)

当我给td一个高度..内容在中间垂直对齐....

<table cellspacing="0">
    <thead>
        <tr>
            <th scope="col" style="width: 180px">Description</th>
            <th scope="col">Textarea</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td height="400">Bla bla bla! Write something if you like! </td>
            <td>
                <textarea></textarea>  <span><img src="http://www.qualtrics.com/university/wp-content/plugins/wp-print/images/printer_famfamfam.gif" alt="printer"> A printer!</span>
            </td>
    </tbody>
</table>

答案 1 :(得分:1)

只需添加一列以避免“A打印机!”链接被强制作为对齐底部附加到textarea。
在你的CSS中你可以省略span的vertical-align,因为你在外面的td中复制了它。

<table cellspacing="0">
<thead>
    <tr>
        <th scope="col" style="width: 180px">Description</th>
        <th scope="col" colspan="2">Textarea</th>
    </tr>
</thead>
<tbody>
    <tr>
        <td>Bla bla bla! Write something if you like! </td>
        <td><textarea></textarea></td>
        <td><span><img src="http://www.qualtrics.com/university/wp-content/plugins/wp-print/images/printer_famfamfam.gif" alt="printer"> A printer!</span>
        </td>
</tbody>

答案 2 :(得分:0)

当我扩展文本框时,左列中的文本垂直位于中间。这是使用Safari,请详细说明其他内容