E-Mail Template Alignment

We recently upgraded to 4.7.2.SP2, and noticed on many orders after the upgrade that the email template (for the order notifications) seems to be adding another column or extra characters or something so that the columns do not line up perfectly anymore. It doesn't do this on every email notification, but most now have this offset alignment issue, which does not make the notifications look polished anymore. (See attachment). Any thoughts on how or where to fix it?

Thanks!

SIDE NOTE:

We also noticed that the email message body background of the e-mail notifications automatically changed to the custom background color of our website theme (not good here since our website background was set to a very dark color - the contrast with the text was poor) - We switched the website theme background color to white to fix this, but maybe a cs-cart developer could split up these two background color tags in future updates?

Everything else seems to be working great so far!

Are you using the older (better) email templates? Or the new email editor?

For either, you may have an addon that is trying to add a column (incorrectly) for data that may or may not be present.

Regarding the background, in the older (better) email templates, all the CSS is embedded within each element. So the only real possibility would be that again, an addon is adding the background color. What does a view source of the email show?

Note there was no attachment(s) to your post.

Thanks for the reply! We're using the "Email templates mode: New (Nice and editable via admin panel)".

The attachment may not be allowed until I have the required posts restrictions removed(?). I'll see if can be added here...

I looked at the Add-ons, and none stood out. We tried to keep add-ons to a minimal since the cart has tons of features out of the box already when originally installed about a year ago.

Email-Template.jpg

Start from checking items in Products table in the Documents section (Invoice and Order Summary)

Open Item description, switch WYSIWYG to source code mode and make sure that all html tags are closed correctly

Thanks for the reply! I was on vacation last week, so I finally had a chance to look at the code:

In Documents->Invoice->Products table->Item description, the code seems fine to me - pretty basic:

{{ p.image }} {{ p.name }}
{% if p.product_code %}{{ p.product_code }}
{% endif %}{% if p.options %}{{ p.options }}{% endif %}
And in Documents->Order summary->Products table->Item description, the code there also seems ok:
{{ p.image }} {{ p.name }}
{% if p.product_code %}{{ p.product_code }}
{% endif %}{% if p.options %}{{ p.options }}{% endif %}
Am I missing something? Thanks...

I did notice a typo in the code above: "text-transfrom: uppercase" in both areas, so I changed it to "text-transform: uppercase" in each area - maybe that would do it? I would think invalid CSS coding would just be somewhat ignored much of the time(?)

I did notice a typo in the code above: "text-transfrom: uppercase" in both areas, so I changed it to "text-transform: uppercase" in each area - maybe that would do it? I would think invalid CSS coding would just be somewhat ignored much of the time(?)

Such kind of typo should not brake anything. It is required to examine issue on your server. Please contact support team