HTMLテーブルの画像とテキストの整列

Question

サンプルの記事では、画像の左側の列と画像の説明の右側の列に2列のhtmlテーブルを追加しました。

問題は、右の列のテキストの説明がイメージの下にあることです。イメージがテキストを別の行に分割するようになっているようです。

これは私が使用されるようなサンプルコードです：

<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

は、テキスト<TD>で、このCSSを試してみてください：

vertical-align:top; 

すなわち：

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

Answer 2

あなたはちょうどあなたがあなたが写真とテキストが正しく整列する理解するために行

Answer 3

の途中でテキストを配置したい場合style="vertical-align:top"

それともvertical-align:middle

tdを追加する必要がありますか？ 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> 

トップ、ボトムおよびセンターは、どのように整列させるかによって使い分ける必要があります。