Question

在我们的电子邮件中有一个菜单，我们希望每个项目之间有一个边框（管道）。我试过把border-right: 1px solid #ffffff放在几个不同的地方而没有运气。边界代码的方式和位置如何？这就是代码的样子：

 <div block="editable" name="Navigation Link 2" description="Style With - color:#FFFFFF; text-decoration:none;" id="navlink2" key="navlink2" display="link">Help</div>
            </td>
             <td align="center" valign="top" style="display: inline-block; padding: 5px 10px; font-family: Arial, Helvetica, sans-serif; font-size: 14px; color: #FFFFFF; border-right:#FFF>

Answer 1

您的HTML似乎不完整，您在样式属性上缺少最终引用，并且您应该在CSS文件中执行样式。

除此之外，您的HTML正在使用border-right:#FFF - 您应该使用类似border-right: solid #FFF;

的内容

注意样式部分（solid），您也可以使用dashed，double等...但默认值为none所以您必须指定一些东西。

Border Style reference

Fiddle Demo

如果你仍然遇到问题，你的dom结构可能有问题，你应该发布更完整的图片。

Answer 2

smerny对你的代码很乱是正确的。如果你想通过电子邮件远程渲染html，你需要确保你的html是干净的。验证者（http://validator.w3.org/）可以为此提供帮助。在为电子邮件编写html时需要考虑很多陷阱，这比我可以进入的更多，但要解决您的具体问题，其中一种方法应该有效：

方法1：

<table>
    <tbody>
        <tr>
            <td style="border-right: solid"> Help </td>
            <td style="border-right: solid"> Lorem </td>
            <td style="border-right: solid"> Ipsum </td>
        </tr>
    </tbody>
</table>

方法2：

<style>
    td {
        border-right: solid;
    }
</style> 



<table>
    <tbody>
        <tr>
            <td> Help </td>
            <td> Lorem </td>
            <td> Ipsum </td>
        </tr>
    </tbody>
</table>

Fiddle

电子邮件菜单的右边框（管道）

2 个答案: