Blackberry mail mystery: gray text in HTML newsletter

The Blackberry mail reader (at least some of the older models like the 8000 series (Pearl, Curve, etc.) seem to have some problems with HTML messages that have tables with backgrounds.  Through some careful investigation, I’ve isolated the problem.

Since HTML mail readers tend to not be very good at rendering modern CSS-based designs, we tend to use old-school table layouts for our HTML newsletters.  It’s common that we’ll have nested tables, like so:

We also sometimes use an old technique to put a thin border around our tables by nesting one table inside another where the outer table has a dark bgcolor and the inner table has a white bgcolor.  This is where the Blackberry mail reader has problems:

Apparently, the Blackberry’s mail reader has logic that automatically inverts the text to a lighter color when it encounters a dark-colored background in a table, and no matter what the bgcolor of the inner table, the font stays that color.

If you need to nest tables  like this, you can explicitly set the font color of the text inside the inner table:

Or you could do something like this with a single table:

While we normally avoid the use of modern <div>-based layouts, many (most?) mail readers will honor a simple inline style like the border for our table.

Leave a Reply

Your email address will not be published. Required fields are marked *