HTML將表格行對齊在頂部

[英]HTML align table rows on top


I have an HTML table. It looks as follows:

我有一個HTML表格。它看起來如下:

<table>
    <tr>
        <td>Content one</td>
        <td rowspan="2"> Very long content right</td>
    </tr>
    <tr>
        <td>Content two</td>
    </tr>
</table>

As you see, I have some very long content on the right side of the table, actually, it is so long that it does not fit into what height is given by the table rows, and so the table gets higher, and by doing that, the contents one and two are no longer at the top of the table, but distribute themselves along the whole height. How can I stop them from doing this?

如你所見,我在表的右側有一些非常長的內容,實際上,它太長了以至於它不適合表行給出的高度,因此表變得更高,並通過這樣做,內容一和二不再位於表的頂部,而是沿整個高度分布。我怎么能阻止他們這樣做?

EDIT: What I need is not the content to be aligned at the top, but the actual rows themselves.

編輯:我需要的不是要在頂部對齊的內容,而是實際的行本身。

5 个解决方案

#1


9  

Interestingly, noone gave the correct answer yet, so I'm jumping in to close this question in a satisfactory way.

有趣的是,還沒有人給出正確的答案,所以我正以令人滿意的方式跳過這個問題。

What you really need is the valign='baseline' CSS property to align the first text lines of the <td> elements.

你真正需要的是valign ='baseline'CSS屬性來對齊元素的第一個文本行。

td {
  vertical-align: baseline;
}

#2


27  

Styling is normally to be done with CSS. You need to set the td element's CSS vertical-align property to top.

樣式通常用CSS完成。您需要將td元素的CSS vertical-align屬性設置為top。

td {
    vertical-align: top;
}

#3


0  

if you want to TD to be aligned at the top you need to set the vertical-align of the TR in the CSS not the TD

如果你想讓TD在頂部對齊,你需要在CSS中設置TR的垂直對齊而不是TD

#4


-3  

<td valign='top' >

#5


-3  

May be you use the div for internal scroll option without disturbing the page height.

可能是您使用div進行內部滾動選項而不會影響頁面高度。


注意!

本站翻译的文章,版权归属于本站,未经许可禁止转摘,转摘请注明本文地址:https://www.itdaan.com/blog/2010/04/17/729c09d563a591a2bd6fffb4f5275703.html



 
粤ICP备14056181号  © 2014-2020 ITdaan.com