Common Compatibility Issues With Lotus Notes

Hello all and Campaignmonitor team,

I have a reuqest to implement email template work on Lotus Notes.
But i know Lotus Notes doesn't support some css and html tags.
( Now i have issue with background-color and space between cells (rows) of table)

So, i found an article. In this article wrote:

Lotus Notes 8
Notes is widely used, but primarily by people who work in organizations that mandate its use. It’s an application which has a lot to offer the business world, but when it comes to email rendering Lotus Notes falls behind. Lotus Notes supports a number of items from our list, but they matter little when the most important properties fail. And they can even be detrimental to readability as with its support of color while not supporting  background-color (see specifics below).

It should be noted that while the application GUI of versions 6.5 and 8 differ significantly, the actual email-message windows and how they display content is virtually the same. In fact, while reviewing our acid test in Lotus Notes 8, we only noticed one improvement from 6.5: support for width.

This is a step in the right direction, but we would like to see more attention from IBM on properly rendering emails as they develop version 9. It should also be noted that our tests were performed using Notes in POP/IMAP mode, not using Domino Server on the back-end.

Full Support
    Descendant-selectors
    Font family/size/weight/style
    Font-family names with quotes
    Font inheritance
    List-style-image
    Varying link-colors
    Width/height

Partial/No Support (High Priority):
    Background-image
    Background-position
    Color/background-color
    Float/clear
    Margin
    Padding

Partial/No Support (Cosmetic):
    Background-position a:hover
    Border
    Line-height

And this is detail about background-color:

Color/background-color
Probably the most fundamental part of visual design is color; it’s the foundation for design. But beyond support for foreground/background colors for the sake of visual design, inconsistent or partial support can cause accessibility problems. When a black background color is eradicated while white text thereon is properly rendered, the result is white text on a white matte. And with Lotus Notes this is exactly what happened because Lotus Notes supports color but not background-color.
Moreover, because varying link-colors are supported our white link became invisible on a now white background. 

Refer to: http://appliedinfogroup.wordpress.com/2 … look-2007/

In XLS file about Guide to CSS support in email at :
http://www.campaignmonitor.com/css/

The background-color is noted YES in Lotus Notes 8.5 column.
But the background is noted NO in Lotus Notes 8.5 column.

I tested on Lotus Notes 8.5 (Windows 7), Lotus Notes doesn't dislay the background-color.

>>> Could you please help me to confirm that Lotus Notes can display background-color attribute?

>>> Another issue is the email template always has space between rows of table.

Please help me.
Thank you very much.
Regards,
Cuong.Vu

roshodgekiss roshodgekiss, 4 years ago

Hey there Cuong, that's very interesting. I just ran a test in Lotus Notes 8.5.3 and can confirm background-color worked:

http://f.cl.ly/items/1Y1i0u0u0r3b0r000o2m/background-color.png

Code:

<td>background-color</td>
    <td style="background-color:#FF0000;"><p>Pancetta swine drumstick tri-tip.</p></td>

>>> Another issue is the email template always has space between rows of table

I don't think I've experienced this personally, but I would recommend using <table cellpadding="0" cellspacing="0" ... > and applying border-collapse: collapse; . Thanks Cuong - let us know how you go here.


Get in touch with us on Twitter: http://twitter.com/campaignmonitor
We're also on Facebook: http://facebook.com/campaignmonitor
afferennen, 3 years ago

background-color is not supported on <table> elements, but it is on <td> cells.

<table border="0" cellpadding="0" cellspacing="0" width="100%">
     <tr>
          <td valign="top" style="border-collapse: collapse;background-color:#FFFFFF;">
               ...
          </td>
     </tr>
</table>
roshodgekiss roshodgekiss, 3 years ago

Hi afferennen, you could try using bgcolor instead, eg.

<td bgcolor="#FFFFFF" ... >

HTML attributes tend to be much better supported.


Get in touch with us on Twitter: http://twitter.com/campaignmonitor
We're also on Facebook: http://facebook.com/campaignmonitor

Join 200,000 companies around the world that use Campaign Monitor to run email marketing campaigns that deliver results for their business.

Get started for free
1-888-533-8098