为什么td宽度会被忽略而变为100%?

时间:2012-05-30 05:43:25

标签: html html-table

好的,这让我非常愤怒。此代码似乎没有任何问题,但由于某种原因,将第一个td渲染到表的可用宽度的100%,剩下的td只是推动并扩展表的宽度。任何人?如果你想看到完整的东西,请点击这里。这让我疯狂。 this is what happens

    <!-- FOOTER -->
<tr width="630" align="left" height="65" bgcolor="#322e39">

<!-- TEASERS -->
<td width="137" height="65" bgcolor="#322e39">
<img src="http://www.webedgemarketing.info/dev/msa/images/em-ft-tease-1.png" width="137" height="65"/>
</td>

<td width="125" height="65" bgcolor="#322e39">
<img src="http://www.webedgemarketing.info/dev/msa/images/em-ft-tease-2.png" width="125" height="65"/>
</td>

<td width="128" height="65" bgcolor="#322e39">
<img src="http://www.webedgemarketing.info/dev/msa/images/em-ft-tease-3.png" width="128" height="65"/>
</td>

<!-- SOCIAL MEDIA ICONS -->

<td width="53" height="65" bgcolor="#322e39">
<img src="http://www.webedgemarketing.info/dev/msa/images/em-ft-sm-fb.png" width="53" height="65"/>
</td>

<td width="60" height="65" bgcolor="#322e39">
<img src="http://www.webedgemarketing.info/dev/msa/images/em-ft-sm-yt.png" width="60" height="65"/>
</td>

<!-- UNSUBSCR. AND MANAGE -->
<td width="127" height="65">
<a href="#" style="text-decoration:none;">
<font face="Arial" size="1" color="#cfccd3">
Manage My Account
</font>
</a>
<br/>
<a href="#" style="text-decoration:none;">
<font face="Arial" size="1" color="#cfccd3">
Unsubscribe
</font>
</a>
</td>

</tr>

1 个答案:

答案 0 :(得分:1)

问题是因为您将页脚也放在同一个表中使用像这样的单独的表

<table>
<!-- start email content-->
</table>

将表格分开

    <table>
    <tr align="left" height="65" bgcolor="#322e39">

    <!-- TEASERS -->
    <td width="137" height="65" bgcolor="#322e39">
    <img src="http://www.webedgemarketing.info/dev/msa/images/em-ft-tease-1.png" width="137" height="65">
    </td>

    <td width="125" height="65" bgcolor="#322e39">
    <img src="http://www.webedgemarketing.info/dev/msa/images/em-ft-tease-2.png" width="125" height="65">
    </td>

    <td width="128" height="65" bgcolor="#322e39">
    <img src="http://www.webedgemarketing.info/dev/msa/images/em-ft-tease-3.png" width="128" height="65">
    </td>

    <!-- SOCIAL MEDIA ICONS -->

    <td width="53" height="65" bgcolor="#322e39">
    <img src="http://www.webedgemarketing.info/dev/msa/images/em-ft-sm-fb.png" width="53" height="65">
    </td>

    <td width="60" height="65" bgcolor="#322e39">
    <img src="http://www.webedgemarketing.info/dev/msa/images/em-ft-sm-yt.png" width="60" height="65">
    </td>

    <!-- UNSUBSCR. AND MANAGE -->
    <td width="127" height="65">
    <a href="#" style="text-decoration:none;">
    <font face="Arial" size="1" color="#cfccd3">
    Manage My Account
    </font>
    </a>
    <br>
    <a href="#" style="text-decoration:none;">
    <font face="Arial" size="1" color="#cfccd3">
    Unsubscribe
    </font>
    </a>
    </td>

    </tr>
    </table>