极客观点
项目管理
HarmonyOS
我们正在设计一个应用程序，该应用程序将向经理发送电子邮件，提醒他们必须进行某些批准。电子邮件采用 HTML 格式，并包含一个表格。我们不明白我们做错了什么导致最后一段出现在表格的右边而不是下面。
下面是一个示例。像这样的事情我所依赖的工具“整洁”这次没有提示。
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta content=
"HTML Tidy for Linux/x86 (vers 6 November 2007), see www.w3.org"
name="generator">
<meta content='text/html; charset=us-ascii' http-equiv=
"Content-Type">
<style type="text/css">
body {font-family: Calibri; }
caption {font-family: Calibri;color: 'black'; font-size: '125%; }
table.main tr { };
table.main td.bottomcaption {text-align: 'center'; vertical-align: 'middle'; font-family: 'Calibri'; color: 'black'; font-color: 'black'; font-size: '125%'; }
table.main th {vertical-align: 'bottom'; color: blue; background-color: lightyellow; }
</style>
<title>Payable Time awaiting approval</title>
</head>
<body>
<p>Hello, <strong>Daffy Duck</strong>:</p>
<p>According to our records, the following Payable Time is awaiting
approval. Items shown below must be approved in order for
compensation to take place.<br></p>
<p>For questions, please contact <a href=
"MAILTO:SUPPORT@OUR_ORG.COM">Support</a></p>
<table align="left" border="1" class='main' summary="Pending details">
<caption ><strong>Awaiting approval by your reporting
structure</strong></caption>
<tr>
<th align="left"> <br>
Name</th>
<th align="center"> <br>
ID</th>
<th align="center">Work<br>
Date</th>
<th align="center"> <br>
Type</th>
<th align="center"> <br>
Hours</th>
</tr>
<tr>
<td colspan="5">Reporting to Mickey M Mouse (MMM)</td>
</tr>
<tr>
<td align="left">Daisy</td>
<td align="left">D_DUCK</td>
<td align="center">04/29/2013</td>
<td align="left">REG</td>
<td align="right">8.00</td>
</tr>
<tr>
<td align="left">Daisy</td>
<td align="left">D_DUCK</td>
<td align="center">05/01/2013</td>
<td align="left">REG</td>
<td align="right">8.00</td>
</tr>
<tr>
<td align="left">Daisy</td>
<td align="left">D_DUCK</td>
<td align="center">05/02/2013</td>
<td align="left">OT</td>
<td align="right">7.50</td>
</tr>
</table>
<p> <br></p>
<p> </p>
<p>This message comes from The Support Team</p>
</body>
</html>
我们非常希望文本“This message comes from…”出现在表格下方，但它出现在表格右侧，与表格顶部对齐。这适用于 IE7、IE8 和 Firefox 12。
我很感激任何帮助这种情况的建议。
问候，丹尼斯
原文由 Dennis 发布，翻译遵循 CC BY-SA 4.0 许可协议
你可以使用类似的标记：http: //jsfiddle.net/7fAy9/2/
或者，您可以这样做：http: //jsfiddle.net/NNrnc/
但请注意
caption对齐在 HTML5 中已弃用，在 HTML5 中正确的做法是：