相当于浮动在展望 [英] equivalent to float in outlook
问题描述
我试图 float：left 一些表，但只是遇到一个主要问题，outlook不支持浮动。嗯，然后我试图使用表对齐等等，但没有运气。表格只是显示在彼此之下，而不是彼此。任何人都可以做到这一点？
I am trying to float: left some tables, but just encountered a major problem, outlook doesnt support float. Well, then i tried to use table align and so forth, but without luck. The tables just show up, under each other, instead of beside each other. Anything one can do about this?
PS：它在其他设备上工作正常，它的唯一前景。我不能给每个表一个td，因为它会打破一些其他的东西。
PS: it works on other devices just fine, its only outlook. And i can't give each table a td, since it will break some other stuff.
标记：
<table class="products">
<tr>
<td align="left" class="test">
<!-- Product 1 -->
<table align="center">
<tr>
<td class="product">
<a href="#">
<img src="#"/>
</a>
</td>
</tr>
</table>
<!-- Product 2 -->
<table align="center">
<tr>
<td class="product">
<a href="#">
<img src="#"/>
</a>
</td>
</tr>
</table>
<!-- Product 3 -->
<table align="center">
<tr>
<td class="product">
<a href="#">
<img src="#"/>
</a>
</td>
</tr>
</table>
<span class="clear"></span>
</td>
</tr>
</table>
推荐答案
，而不是CSS。
一个工作原理的示例：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"><title></title>
<style type="text/css">
table td { border-collapse: collapse; }
.msoFix { mso-table-lspace:-1pt; mso-table-rspace:-1pt; }
</style>
</head>
<body style="margin: 0px; padding: 0px; background-color: #FFFFFF;" bgcolor="#FFFFFF">
<table width="100%" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td align="center">
<div style="max-width:640px !important;">
<table class="msoFix" width="320" cellpadding="0" cellspacing="0" align="left" bgcolor="#CCCCCC">
<tr>
<td width="15" bgcolor="454545"> </td>
<td width="290" bgcolor="454545" align="left" style="padding: 0px;"> <br>Table 1<br>...<br>
</td>
<td width="15" bgcolor="454545"> </td>
</tr>
</table>
<table class="msoFix" width="320" cellpadding="0" cellspacing="0" align="left" bgcolor="#EEEEEE">
<tr>
<td width="15" bgcolor="959595"> </td>
<td width="290" bgcolor="959595" align="left" style="padding: 0px;"> <br>Table 2<br>...<br>
</td>
<td width="15" bgcolor="959595"> </td>
</tr>
</table>
</div>
</td>
</tr>
</table>
</body></html>
此外，Outlook在对齐的表格之间放置一个4-5像素的间隙。添加此项可将其修剪至约1px：
Also, Outlook puts a 4-5 pixel gap between the aligned tables. Adding this trims it down to about 1px:
<style type="text/css">
.msoFix {
mso-table-lspace:-1pt;
mso-table-rspace:-1pt;
}
</style>
要完全摆脱它，你必须添加边框到你的表hack）。
To get rid of it completely, you'll have to add borders to your tables (another Outlook quirk hack).
这篇关于相当于浮动在展望的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
