宽度不适用于表格单元格

里斯

出于某种原因,当我为表格中的单元格设置宽度时,它不会影响单元格的宽度。仅供参考,我正在为邮件程序使用内联样式。

<table cellpadding="0" cellspacing="0" width="100%">
    <tr>
        <td align="center">
            <table cellpadding="0" cellspacing="0" width="550" style="width: 100%; max-width: 550px; text-align: center; border: 1px solid #003a4b;">
                <tr>
                    <td style="padding-top: 10px;"><span style="font-family: helvetica, sans-serif; font-size: 37px; font-weight: bold; color: #93d600; border-bottom: 1px solid #003a4b;">Hunters Conference 2017</span></td>
                </tr>

                <tr>
                    <td width="80%" style="padding: 20px 0; background-color: blue;"><span style="font-family: helvetica, sans-serif; font-size: 16px; color: #003a4b; background-color: red;">Fyber were honoured to attend and support such a fantastic conference, congratulations to everyone that won a prize on our wheel of fortune!</span></td>
                </tr>

                <tr>
                    <td width="80%" style="padding: 0 55px; padding-bottom: 20px;"><span style="font-family: helvetica, sans-serif; font-size: 16px; color: #003a4b;">We hope you all had a great day, we enjoyed catching up with everyone and it was nice to see our clients face to face. </span></td>
                </tr>

                <!--[if mso]>
                <tr>
                    <td style="padding-bottom: 20px;">
                        <img src="https://gallery.mailchimp.com/b083c967cd22e35ab4ce75e7a/images/2c3e3b5e-9a9f-4864-a36f-6359b0dd4b75.jpg" alt="Spinning Wheel" width="550" style="width: 100%; max-width: 550px;">
                    </td>
                </tr>
                <![endif]-->

                <!--[if !mso]><!-- -->
                <tr>
                    <td style="padding-bottom: 20px;">
                        <img src="https://gallery.mailchimp.com/b083c967cd22e35ab4ce75e7a/images/19e810cd-df47-474b-aa47-3f33bf26922a.gif" alt="Spinning Wheel" width="550" style="width: 100%; max-width: 550px;">
                    </td>
                </tr>
                <!--<![endif]-->
            </table> 
        </td>
    </tr>
</table>

https://jsfiddle.net/xmbsemje/

网络专家

td 的默认行为是填充表格的宽度,因此如果<td>每行只有一个<tr>,则无论您做什么,它都会始终占据表格的整个宽度。一种方法是在该 td 内创建一个表格,并将宽度放在表格上。此外,在电子邮件中向左和向右填充不起作用,因此创建具有定义宽度的表格并将它们居中是最好的选择。

另一种方法是在左侧和右侧放置间隔单元,为您提供填充空间。我按照第一种方法修改了您的代码(只是带有蓝色/红色和白色背景的文本单元格)。

请注意:我没有修复你的所有代码,只是改变了一些让你开始

<table cellpadding="0" cellspacing="0" width="100%">
    <tr>
        <td align="center">
            <table cellpadding="0" cellspacing="0" width="550" style="width: 100%; max-width: 550px; text-align: center; border: 1px solid #003a4b;">
                <tr>
                    <td style="padding-top: 10px;"><span style="font-family: helvetica, sans-serif; font-size: 37px; font-weight: bold; color: #93d600; border-bottom: 1px solid #003a4b;">Hunters Conference 2017</span></td>
                </tr>

                <tr>
                  <td align="center" style="padding: 20px 0; background-color: blue;">
                    <table border="0" cellpadding="0" cellspacing="0" style="width:80%;">
                      <tr>
                        <td align="left"><span style="font-family: helvetica, sans-serif; font-size: 16px; color: #003a4b; background-color: red;">Fyber were honoured to attend and support such a fantastic conference, congratulations to everyone that won a prize on our wheel of fortune!</span></td>
                      </tr>
                    </table>
                  </td>                    
                </tr>

                <tr>
                  <td align="center" style="padding: 20px 0;">
                    <table border="0" cellpadding="0" cellspacing="0" style="width:80%;">
                      <tr>
                        <td align="left"><span style="font-family: helvetica, sans-serif; font-size: 16px; color: #003a4b;">We hope you all had a great day, we enjoyed catching up with everyone and it was nice to see our clients face to face. </span></td>
                      </tr>
                    </table>
                  </td>
                </tr>

                <!--[if mso]>
                <tr>
                    <td style="padding-bottom: 20px;">
                        <img src="https://gallery.mailchimp.com/b083c967cd22e35ab4ce75e7a/images/2c3e3b5e-9a9f-4864-a36f-6359b0dd4b75.jpg" alt="Spinning Wheel" width="550" style="width: 100%; max-width: 550px;">
                    </td>
                </tr>
                <![endif]-->

                <!--[if !mso]><!-- -->
                <tr>
                    <td style="padding-bottom: 20px;">
                        <img src="https://gallery.mailchimp.com/b083c967cd22e35ab4ce75e7a/images/19e810cd-df47-474b-aa47-3f33bf26922a.gif" alt="Spinning Wheel" width="550" style="width: 100%; max-width: 550px;">
                    </td>
                </tr>
                <!--<![endif]-->
            </table> 
        </td>
    </tr>
</table>

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

基于colgroup的表格单元格的宽度不适用于两个表格

来自分类Dev

Google表格公式有时不适用于合并单元格

来自分类Dev

表格视图不适用于自定义单元格

来自分类Dev

最大宽度不适用于表格单元

来自分类Dev

VBA查找不适用于合并的单元格

来自分类Dev

条件格式不适用于UITableView单元格

来自分类Dev

HTML5 CSS 等高列不适用于图像 [表格/表格单元格方法]

来自分类Dev

Excel VBA 单击单元格以触发宏 - 不适用于合并的单元格

来自分类Dev

具有固定百分比的表格单元格不适用于许多项目

来自分类Dev

Excel 2010日期格式不适用于某些单元格,但适用于其他单元格

来自分类Dev

Excel 2010日期格式不适用于某些单元格,但适用于其他单元格

来自分类Dev

Excel自动调整行高不适用于自动换行的合并单元格

来自分类Dev

:selected伪类样式不适用于单元格

来自分类Dev

CSS background-color不适用于所有具有class的单元格

来自分类Dev

可变参考单元格不适用于静态成员

来自分类Dev

反应表排序不适用于带有自定义单元格的列

来自分类Dev

vlookup函数不适用于单元格更改处理程序

来自分类Dev

尝试进行中心对齐时,Excel格式不适用于某些单元格

来自分类Dev

PHPExcel excel读取不适用于某些带有计算的单元格

来自分类Dev

自动调整大小的单元格不适用于图像

来自分类Dev

联合功能不适用于单个单元格范围VBA

来自分类Dev

快速,自定义单元格颜色不适用于显示指示器

来自分类Dev

Excel INDEX / MATCH不适用于以“ 1 /”开头的单元格

来自分类Dev

HSSFRichTextString样式不适用于具有默认值的单元格

来自分类Dev

UITableView 不适用于阿拉伯语单元格

来自分类Dev

使用 RxSwift 删除多个 UITableView 项目不适用于自定义单元格

来自分类Dev

条件格式不适用于所有单元格

来自分类Dev

IE将“顶部”设置为百分比值,不适用于表格单元格中绝对定位的元素

来自分类Dev

IE将“顶部”设置为百分比值,不适用于表格单元格中绝对定位的元素

Related 相关文章

  1. 1

    基于colgroup的表格单元格的宽度不适用于两个表格

  2. 2

    Google表格公式有时不适用于合并单元格

  3. 3

    表格视图不适用于自定义单元格

  4. 4

    最大宽度不适用于表格单元

  5. 5

    VBA查找不适用于合并的单元格

  6. 6

    条件格式不适用于UITableView单元格

  7. 7

    HTML5 CSS 等高列不适用于图像 [表格/表格单元格方法]

  8. 8

    Excel VBA 单击单元格以触发宏 - 不适用于合并的单元格

  9. 9

    具有固定百分比的表格单元格不适用于许多项目

  10. 10

    Excel 2010日期格式不适用于某些单元格,但适用于其他单元格

  11. 11

    Excel 2010日期格式不适用于某些单元格,但适用于其他单元格

  12. 12

    Excel自动调整行高不适用于自动换行的合并单元格

  13. 13

    :selected伪类样式不适用于单元格

  14. 14

    CSS background-color不适用于所有具有class的单元格

  15. 15

    可变参考单元格不适用于静态成员

  16. 16

    反应表排序不适用于带有自定义单元格的列

  17. 17

    vlookup函数不适用于单元格更改处理程序

  18. 18

    尝试进行中心对齐时,Excel格式不适用于某些单元格

  19. 19

    PHPExcel excel读取不适用于某些带有计算的单元格

  20. 20

    自动调整大小的单元格不适用于图像

  21. 21

    联合功能不适用于单个单元格范围VBA

  22. 22

    快速,自定义单元格颜色不适用于显示指示器

  23. 23

    Excel INDEX / MATCH不适用于以“ 1 /”开头的单元格

  24. 24

    HSSFRichTextString样式不适用于具有默认值的单元格

  25. 25

    UITableView 不适用于阿拉伯语单元格

  26. 26

    使用 RxSwift 删除多个 UITableView 项目不适用于自定义单元格

  27. 27

    条件格式不适用于所有单元格

  28. 28

    IE将“顶部”设置为百分比值,不适用于表格单元格中绝对定位的元素

  29. 29

    IE将“顶部”设置为百分比值,不适用于表格单元格中绝对定位的元素

热门标签

归档