css - HTML メール - コンテンツを縦に並べる

Question

私はこのフォーラムを初めて使用します。この質問が他の場所で既に解決されている場合は、事前にお詫び申し上げます。実際に役立つものは何も見つかりませんでした。

クライアントが自分でコンテンツを追加できる動的プラットフォームで使用する単純な HTML テンプレートをコーディングしています。

テンプレートには、下部に 3 つのストーリーがあり、各ストーリーのコンテンツの長さに関係なく、垂直方向に整列する必要があります。

ブロック全体の高さを決定するには、より長いストーリーが必要になるのが理想的です。

今のところ問題ありません。

問題が発生するのは、動的プラットフォームのために、1 つのストーリーのコンテンツを特定の動的タグ内に保持する必要があると同時に、最長のストーリーが他の 2 つのストーリーの高さを決定する方法を見つける必要があるためです。

編集 明確にするために、「続きを読む」セルを常に下に揃える必要があります。タイトルと説明セルの高さが異なる場合は、上の画像を常に上に揃える必要があります。

これが私のコードの構造です。どんな提案にもとても感謝しています。

<table width="650" border="0" cellspacing="0" cellpadding="0">
          <tr>
            <td>
            <DYNAMIC TAG>
                <table width="195" border="0" cellspacing="0" cellpadding="0">
                      <tr>
                        <td><img src="images/image.jpg"/></td>
                      </tr>
                          <tr>
                            <td>Title </td>
                          </tr>
                      <tr>
                        <td>Text</td>
                      </tr>
                          <tr>
                            <td><a href="#">Read More</a></td>
                          </tr>
                 </table>
               </DYNAMIC TAG>  
            </td>

            <td width="22">&nbsp;</td>
                <td width="195" valign="top">
                    <DYNAMIC TAG>
                        <table width="195" border="0" cellspacing="0" cellpadding="0">
                              <tr>
                                <td><img src="images/image.jpg"/></td>
                              </tr>
                                  <tr>
                                    <td>Title </td>
                                  </tr>
                              <tr>
                                <td>Text</td>
                              </tr>
                                  <tr>
                                    <td><a href="#">Read More</a></td>
                                  </tr>
                         </table>
                       </DYNAMIC TAG>  
                    </td>
                    <td width="23">&nbsp;</td>
                        <td width="195" valign="top">
                          <DYNAMIC TAG>
                            <table width="195" border="0" cellspacing="0" cellpadding="0">
                                  <tr>
                                    <td><img src="images/image.jpg"/></td>
                                  </tr>
                                      <tr>
                                        <td>Title </td>
                                      </tr>
                                  <tr>
                                    <td>Text</td>
                                  </tr>
                                      <tr>
                                        <td><a href="#">Read More</a></td>
                                      </tr>
                             </table>
                          </DYNAMIC TAG>  
                            </td>
             </tr>
        </table>

私が明確であり、すべてが理にかなっていることを願っています.

素敵な一日を過ごす、

エレオノーラ。