If you work in the world of email marketing, you probably know thatOutlook is THE email client that all integrators hate. Today, I'm going to tell you about a quirk that we haven't discussed so far, and about which I haven't found much documentation on the net.
The VML
As a reminder, if Outlook is so bad in terms of HTML rendering it comes from the fact that it uses as HTML rendering engine the one in Word which is absolutely not meant for that. It would be like using a radiator to make toast. You could do it too, but that's not really the idea...

As a result, most " fix "that integrators have put in place to address this is done via the VML languagea language specific to Word. This language allows to do some things, but unfortunately not everything, and it also brings its share of bugs...
A padding problem
I recently noticed an alignment issue in some cases on Outlook.
You will find an example by clicking here
We can see here that the nested tables are staggered in Outlook messaging on Windows.
Why? Because in some cases, the padding-left
put on the tag td
of a table in Outlook will be placed on the right, adding therefore to the padding-right
instead of applying to the left as would be expected.
I found this padding bug on Outlook in the following cases:
- When a
table
is embedded in VML code, that thistable
itself hastables
and that thetd
of this table have apadding-left
. And this whatever the writing is:padding-left: 10px
orpadding: 10px
will have the same concern.
That's a lot of things, and that's what makes this bug all the more difficult to identify. There are probably other obscure conditions to encounter this bug.

Is there a doctor solution for this padding bug on Outlook?
Yes, as is often the case in email, we can get around the Outlook problemby playing with variable width tables centered in other tables. This will make the code more complex, depending on the desired result, but it will be possible to find a way to achieve it.