将两个表格列的内容对齐在一起答案

【问题标题】：Align contents of two table columns together将两个表格列的内容对齐在一起
【发布时间】：2021-03-24 18:29:54
【问题描述】：

处理电子邮件模板，尝试使其成为包含日期和消息列的 2 列电子邮件。我能够使用表格使列正常工作，但现在排列不正确。

这是构建 html 的代码

<table border="0" cellpadding="0" cellspacing="0" width="600" id="templateColumns">
                <tr>
                    <td align="center" valign="top" width="50%" class="templateColumnContainer">
                        <table border="0" cellpadding="10" cellspacing="0" width="100%">
                            <tr>
                                <div class='label'>Date</div>
                                <td valign="top" class="leftColumnContent">
                                    <div class='value'><?= $title; ?> </div><br>
                                </td>
                            </tr>
                        </table>
                    </td>
                    <td align="center" valign="top" width="50%" class="templateColumnContainer">
                        <table>
                            <tr>
                                <div class='label'>Message</div>
                                <td valign="top" class="rightColumnContent">
                                    <div class='value'><?= $title1; ?> </div><br>
                                </td>
                            </tr>
                        </table>
                    </td>
                </tr>
            </table>

有没有办法更改 HTML 以使每个条目正确排列？

【问题讨论】：

标签： html html-email

【解决方案1】：

不太确定您要对表中的表执行什么操作。默认情况下，表格将排列行，这就是它的作用。看起来您有 1 行，并将每列的所有数据放入一个单元格中。

定义表格标题的一行；日期和消息

每行数据的新行。

   <table border="0" cellpadding="0" cellspacing="0" width="600" id="templateColumns">
        <tr>
            <th>Date</th>
            <th>Message</th>
        </tr>
        <tr>
            <td>
                <?= $title; ?>
            </td>
            <td>
                <?= $title1; ?>
            </td>
        </tr>
    </table>

您的两个变量是否包含每个变量中的所有列数据？比如，$title 是否包含整个日期列表？如果是这样，我们需要使用一些 javascript 来解析这些数据

【讨论】：