7

I work on HTML email campaign builds on a daily basis and in the past 24 hours I've seen all of my emails aligning left. This includes the email campaigns I've built previously (which were tested in Yahoo! Mail and used to align center).

Has anyone else come across this? Any ideas what is causing it and whether there is a fix that can be added?

The standard coding used is tables with align center. This now doesn't work and all tables align left it seems.

Ed Johnson
  • 201
  • 2
  • 6
  • Yes i confirm this too, the newsletter I sent yesterday aligned left, seems they strip any center alignment from now on. – vaskort May 15 '14 at 12:56
  • Does anyone have any information on why they did this or if it was intentional? Seems like a bug on Yahoo's end. – rojobuffalo Jun 20 '14 at 18:37

4 Answers4

12

I've found a solution for this.

On the outer-most 100% width and centrally aligned table add this code:

style="table-layout: fixed;"

This should fix it.

Ed Johnson
  • 201
  • 2
  • 6
  • This made the column expand the full width of the email which looked bad. I used
    ...
    which worked for me.     – CoderDave Sep 27 '14 at 02:07
  • This doesn't work for me, instead I added to the main table wrapper a margin style : style="margin:0 auto;". Hope it helps – Gew Mar 02 '15 at 15:35
  • This doesn't work because on other email clients it causes the content to be cut off rather than be 100% width. – snorkelzebra May 11 '15 at 21:40
3

Add a class to the style block in the head of the email. 

.table-center { table-layout: fixed; margin: 0 auto; }

Add this class to the outermost table to get the body centered in the window. Then add it to descendant tables as needed for center alignment.

rojobuffalo
  • 3,113
  • 3
  • 15
  • 16
0

I tried both of the solutions provided and neither was able to solve the problem. I believe there is a larger issue – Yahoo! mail wraps the email in several div tags, one with a class of "body". This div is given a width value of "auto".

When I change this value, via Chrome developer tools, from "auto" to "100%" it fixes the problem.

Unmodified:

enter image description here

"Fixed":

enter image description here

Because this div is outside of the reach of my style block in the head of the email I do not believe this issue can actually be fixed. I would classify this as a bug on Yahoo's part.

Charlie Stanard
  • 909
  • 2
  • 9
  • 19
  • Hi Istanard, make sure you wrap a 100% width table around the outside of your entire email, within that have a "content" table at the width you would like your email (best practice is 640 or 600 pixels). Within the outer table include `style="table-layout: fixed; margin: 0 auto;` - within the outermost TD include an `align="center"` tag too. – Ed Johnson Jun 24 '14 at 16:06
0

I second Ed Johnson's answer here regarding the "fixed; margin: 0 auto;" style on the outer table. I just used this fix instead of the "table-layout: fixed" style because the latter seemed to break my responsive email style.

Brandon Boyd
  • 11
  • 4