Ячейка заголовка HtmlTable не выравнивается при просмотре в Outlook - PullRequest
Новая
       102

Ячейка заголовка HtmlTable не выравнивается при просмотре в Outlook

0 голосов
/ 01 мая 2020

Я не могу выровнять свою первую ячейку заголовка, независимо от того, что я пытался (при просмотре в Outlook)

Заголовок последней ячейки тоже изначально был выровнен и был на одну строку выше от центра. Мне удалось выровнять последнюю ячейку заголовка.

Могу ли я узнать, есть ли обходные пути или есть более чистое решение для моего подхода?

enter image description here

HTML Выход 

<table border='1' width='100%'>
   <tr>
      <th style='vertical-align: top'>Others Subsidy Start Date</th>
      <th style='vertical-align: top'>Others Subsidy End Date</th>
      <th style='vertical-align: top'>Center</th>
      <th style='vertical-align: top'>Child Name</th>
      <th style='vertical-align: top'>Child BC</th>
      <th style='vertical-align: top'>Upcoming Disbursement Amount</th>
      <th style='vertical-align: top'>Disbursement Number</th>
      <th style='vertical-align: top'>Number of Remaining Disbursements</th>
   </tr>
   <tr>
      <td style='vertical-align: top'></td>
      <td style='vertical-align: top'></td>
      <td style='vertical-align: top'>User Acceptance Testing Centre</td>
      <td style='vertical-align: top'>UAT Jackson Loh</td>
      <td style='vertical-align: top'>TXXXXXXXK</td>
      <td style='vertical-align: top'>$20</td>
      <td style='vertical-align: top'>2</td>
      <td style='vertical-align: top'>2</td>
   </tr>
</table>

C#

HtmlTableRow row;
row = new HtmlTableRow();

row.Cells.Add(new HtmlTableCell { InnerText = "Others Subsidy Start Date" });
row.Cells.Add(new HtmlTableCell { InnerText = "Others Subsidy End Date" });
row.Cells.Add(new HtmlTableCell { InnerText = "Center" });
row.Cells.Add(new HtmlTableCell { InnerText = "Child Name" });
row.Cells.Add(new HtmlTableCell { InnerText = "Child BC" });
row.Cells.Add(new HtmlTableCell { InnerText = "Upcoming Disbursement Amount" });
row.Cells.Add(new HtmlTableCell { InnerText = "Disbursement Number" });
row.Cells.Add(new HtmlTableCell { InnerText = "Number of Remaining Disbursements" });
table.Rows.Add(row);
row = new HtmlTableRow();

row.Cells.Add(new HtmlTableCell { InnerText = othersSubsidyStart.ToString() });
row.Cells.Add(new HtmlTableCell { InnerText = othersSubsidyEnd.ToString() });
row.Cells.Add(new HtmlTableCell { InnerText = centre });
row.Cells.Add(new HtmlTableCell { InnerText = childName });
row.Cells.Add(new HtmlTableCell { InnerText = childBC });
row.Cells.Add(new HtmlTableCell { InnerText = "$" + ((double)dAmount1).ToString() });
row.Cells.Add(new HtmlTableCell { InnerText = "1" });
row.Cells.Add(new HtmlTableCell { InnerText = remainingDisbursements.ToString() });
table.Rows.Add(row);
row = new HtmlTableRow();

output = (mailMessage.ToString())
            .Replace("<table>", "<table border='1' width='100%'>")
            .Replace("<td>Others Subsidy Start Date</td>", "<th style='vertical-align: top'>Others Subsidy Start Date</th>")
            .Replace("<td>Others Subsidy End Date</td>", "<th style='vertical-align: top'>Others Subsidy End Date</th>")
            .Replace("<td>Center</td>", "<th style='vertical-align: top'>Center</th>")
            .Replace("<td>Child Name</td>", "<th style='vertical-align: top'>Child Name</th>")
            .Replace("<td>Child BC</td>", "<th style='vertical-align: top'>Child BC</th>")
            .Replace("<td>Upcoming Disbursement Amount</td>", "<th style='vertical-align: top'>Upcoming Disbursement Amount</th>")
            .Replace("<td>Disbursement Number</td>", "<th style='vertical-align: top'>Disbursement Number</th>")
            .Replace("<td>Number of Remaining Disbursements</td>", "<th style='vertical-align: top'>Number of Remaining Disbursements</th>")
            .Replace("<td>", "<td style='vertical-align: top'>")
            + "<td><b>Upcoming Disbursement Amount: $" + totalDisbursementAmount + "</b></td>";
}

1 Ответ

0 голосов
/ 02 мая 2020

Для внешнего вида?

Вы создаете HTML электронное письмо?

Попробуйте сделать следующее: 

<head>
<style type="text/css">
.myawesomehead{vertical-align:top;}
.myawesomecell{font-weight:bold;}
</style>
</head>

<body>
<table border="1" width="100%">
   <tr>
      <td class="myawesomehead,myawesomecell">Others Subsidy Start Date</td> 
      <td class="myawesomehead,myawesomecell">Others Subsidy End Date</td>
      <td class="myawesomehead,myawesomecell">Center</td>
      <td class="myawesomehead,myawesomecell">Child Name</td>
      <td class="myawesomehead,myawesomecell">Child BC</td>
      <td class="myawesomehead,myawesomecell">Upcoming Disbursement Amount</td>
      <td class="myawesomehead,myawesomecell">Disbursement Number</td>
      <td class="myawesomehead,myawesomecell">Number of Remaining Disbursements</td>
   </tr>
   <tr>
      <td class="myawesomecell"></td>
      <td class="myawesomecell"></td>
      <td class="myawesomecell">User Acceptance Testing Centre</td>
      <td class="myawesomecell">UAT Jackson Loh</td>
      <td class="myawesomecell">TXXXXXXXK</td>
      <td class="myawesomecell">$20</td>
      <td class="myawesomecell">2</td>
      <td class="myawesomecell">2</td>
   </tr>
</table>
</body>

По моему опыту, добавление CSS к тегу head и добавление атрибутов тега в double (") вместо single (') экономит несколько проблем в различных почтовых клиентах. код, с которым вам придется иметь дело с обратной косой чертой.

...