匹配TD高度

我目前正在建设一个HTML电子邮件和我在与所有的电子邮件客户端做两个TD的高度相同的实际问题。匹配TD高度

这是一个敏感的电子邮件，让我分开列到两个表中，而不是在相同的一个嵌套的这一切，使他们能够相互扣下在手机上。

我试图说明在TD的和都收效甚微的表都高度，最后我即使在最小高度投掷。

我应该说，它适用于所有基于Web的浏览器（雅虎除外），我的大问题是与Outlook 2007 & 2010这是客户实际上测试邮件恼人的足够。

这里有一个例子：

<!-- square panels wrapper --> 
<table width="600" border="0" cellpadding="0" cellspacing="0" class="square_panel_wrapper"><tr><td> 

    <!-- square panels container --> 
    <table width="600" border="0" cellpadding="0" cellspacing="0" class="square_panel_container"><tr><td> 

     <!-- left table --> 
     <table width="290" height="640" border="0" cellpadding="10" cellspacing="0" align="left" class="square_panel_left" style="border: 1px solid #c8c9cb; height: 640px; min-height: 640px;"> 
      <tr> 
      <td valign="top" align="left" style="font-family:Verdana, Arial, Helvetica, sans-serif; font-size: 16px; color: #414042; line-height:1.5em; text-align: left; vertical-align: top;">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean vitae commodo leo</td> 
      </tr> 
      <tr> 
      <td valign="top" align="left" style="font-family:Verdana, Arial, Helvetica, sans-serif; font-size: 16px; color: #414042; line-height:1.5em; text-align: left; vertical-align: top;">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean vitae commodo leo</td> 
      </tr> 
     </table> 

     <!-- right table --> 
     <table align="right" width="290" height="640" border="0" cellpadding="10" cellspacing="0" class="square_panel_right" style="border: 1px solid #c8c9cb; height: 640px; min-height: 640px;"> 
      <tr> 
       <td valign="top" align="left" style="font-family:Verdana, Arial, Helvetica, sans-serif; font-size: 16px; color: #414042; line-height:1.5em; margin-top: 0px; text-align: left; vertical-align: top;">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean vitae commodo leo. Aenean molestie tristique erat a consequat. Vestibulum nec nunc vel velit ornare fermentum in eget ipsum. Mauris venenatis volutpat malesuada. Curabitur fringilla libero at turpis tempor egestas quis rhoncus quam. 
      </td> 
      </tr> 
      <tr> 
      <td valign="top" align="left" style="font-family:Verdana, Arial, Helvetica, sans-serif; font-size: 16px; color: #414042; line-height:1.5em; text-align: left; vertical-align: top;">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean vitae commodo leo</td> 
      </tr> 
     </table> 

    </td></tr></table> 

</td></tr></table>

来源

2013-03-02 Chris Robinson

如果高度<td>始终是固定的，你可以尝试在<td>插入<img src="http://somesite.com/dot.png" style="width:1px;height:640px" />，这个透明图像将是无形的，有固定的高度，使你的<td>将具有相同的分 - 像图像一样高。

来源

2013-03-02 13:41:12 wearwoolf

是的，正确伤心wearwoolf您可以强制使用min-height属性的TD - 把看不见的图像在TD，或包裹你TD成格。第一种情况示例：

<td><img style="float:left;min-height:50px;visibility:hidden;width:0px;">12345</td>

来源

2013-05-21 12:41:45 macloving

匹配TD高度

回答

相关问题