css - 表列充当表行

标签 css html-table html-email

下面是 chrome 中的预览,正是我想要的样子。完美!


Preview on chrome


这是带有错误的 Firefox 预览。
第 2 个 [td] 进入下一行。


Firefox preview

这将用作电子邮件签名

要查看代码,这里是实时 url:http://dgntesting.com/ryan/johnmarkham2/table.html
我已经尝试了所有方法,但仍然无法在 Firefox 中找出问题。

这是代码:---------------------------------------- --

<table width="540" cellpadding="0" cellspacing="0" style="border-collapse:collapse;border:0;border-spacing:0;">
    <tr>
        <td width="540" height="157" style="padding:0"><img width="540" src="http://dgntesting.com/ryan/johnmarkham2/img/logo-final.png" height="157" valign="top" style="margin:0;vertical-align:top;padding:0;"></td>
    </tr>
    <tr>
        <td style="padding:0;margin:0;border:0;" width="540">
            <table width="540" cellpadding="0" cellspacing="0" style="border-collapse: collapse;border:0;border-spacing:0;">
                <tr>
                    <td height="67" style="padding:0;border-width:0;vertical-align:top;display:inline-block;"><a href="https://www.jimsbuildinginspections.com.au/" style="padding:0;text-decoration:none;"><img src="http://dgntesting.com/ryan/johnmarkham2/img/bottom-left.png" width="368" height="67" valign="top" style="margin:0;padding:0;vertical-align:top;"></a></td>

                    <td height="67" style="padding:0;border-width:0;vertical-align:top;display:inline-block;"><a href="tel:131546" style="padding:0;text-decoration:none;"><img src="http://dgntesting.com/ryan/johnmarkham2/img/bottom-right.png" width="172" height="67" valign="top" style="margin:0;padding:0;vertical-align:top;"></a></td>
                </tr>
            </table>
        </td>
    </tr>
</table>

非常感谢您的帮助。 谢谢!

最佳答案

您需要移除显示 inline-block 表单 td

<td style="padding:0;margin:0;border:0;" width="540">
                                <table width="540" cellpadding="0" cellspacing="0" style="border-collapse: collapse;border:0;border-spacing:0;">
                                    <tbody><tr>
                                        <td height="67" style="padding:0;border-width:0;vertical-align:top;"><a href="https://www.jimsbuildinginspections.com.au/" style="padding:0;text-decoration:none;"><img src="http://dgntesting.com/ryan/johnmarkham2/img/bottom-left.png" width="368" height="67" valign="top" style="margin:0;padding:0;vertical-align:top;"></a></td>

                                        <td height="67" style="padding:0;border-width:0;vertical-align:top;"><a href="tel:131546" style="padding:0;text-decoration:none;"><img src="http://dgntesting.com/ryan/johnmarkham2/img/bottom-right.png" width="172" height="67" valign="top" style="margin:0;padding:0;vertical-align:top;"></a></td>
                                    </tr>
                                </tbody></table>
                            </td>

关于css - 表列充当表行,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/50422698/

相关文章:

html - 需要在 ol 列表中右对齐十进制数

javascript - 使用 CSS3 列表编号对齐

php - 在某些 <td> 上显示 <div>

php - 如何在 Controller 或 View 之外使用 Zend Framework 部分 View 助手?

HTML电子邮件签名文件在回复中有黑边

html - 小屏幕上的源排序列

css - 文本逐渐向下移动,不再与文本框顶部齐平

python-3.x - 合并 pandas "data frame.style"对象并输出到 html

javascript - 表搜索 Javascript 和 jQuery CSS

html - 使用 cid :attachmentID in e-mail for image file used in css 的语法是什么