HTML表格對齊圖像和文字

Question

在示例文章中，我添加了一個html表格widh 2列，圖像左列和圖像描述右列。

問題是，右欄上的文字描述在圖像下方，就像圖像迫使文本分成另一行。

這是爲我所用的樣本代碼：

<table> 
<tr> 
<td>Image.jpg</td> 
<td>Image.jpg description</td> 
</tr> 
<tr> 
<td>Image2.jpg</td> 
<td>Image2.jpg description</td> 
</tr> 
</table> 

您可以在這裏看到On this page

Answer 1

問題試試這個CSS文本<TD>：

vertical-align:top; 

即：

<td style="vertical-align:top;"> 
    Trio: Quaisquer três cartas do mesmo valor. Este exemplo ... 
</td> 

Answer 2

你只需要添加style="vertical-align:top"到td

或者vertical-align:middle，如果你想在該行

Answer 3

所以中間的定位文本明白你想要的照片，並對準正確的文本？你可以使用valign屬性嗎？

<table> 
<tr> 
<td valign="top">January</td> 
<td valign="top">$100</td> 
</tr> 
<tr> 
<td valign="bottom">February</td> 
<td valign="bottom">$80</td> 
    </tr> 
</table> 

頂部，底部和中心應根據您希望如何對齊。