My images show as the wrong size or are not lining up

Applies To:    PoliteMail Desktop      PoliteMail Online     PoliteMail O365

Version:  4.9    5.0    5.1+

Are recipients sending you screen shots of poorly laid-out emails, when you know you sent them correctly?

Verify You're Not Using a Previously Sent Template

First, make sure you are not using a previously sent template including a forwarded email, or one that was in your Sent folder. Once an email has been processed through Outlook, it re-writes it and adds its own HTML and styling, which can overwrite or replace the code you used to build the original template in the PoliteMail Builder. The further the template is removed from the original, and the more it gets rewritten and the more likely it is to have issues with formatting and styling.

Check Windows Text Scaling

Windows sets text to become larger by default on new high-resolution displays, usually laptops. This is so you can actually read the text and doesn't shrink due to the higher-resolution monitor.  

Windows Text Scaling settings (sometimes called Desktop Scaling or Display Scaling) can be found in Windows Control Panels > Display Settings).  This setting changes the DPI (dots per inch) resolution of the monitor, which works fine for most things.  You might notice looking at a web page that some images get a little pixelated as they get scaled up. That’s usually acceptable.

So why does your email behave differently?

The issue is how Outlook handles the email message (more specifically, how the HTML is converted to be Word compatible – Word is used to render and edit pages in Outlook).

The concept to understand here is relative sizing vs. absolution sizing, and how this applies to Content items within an HTML email.

Content items like images are specified as pixels (px), which are absolute. Content items like fonts are specified as points (pt). Table elements might be specified as pixels, percentages or points.

When you put HTML into Outlook, Outlook will convert all px values into points, except for images. So images are absolutely sized, while everything else in the email is sized relative to the DPI settings of the display. Hence the layout problems.

Ideally, the creator of the email content, for both images, text and table layouts, should be working at 100% DPI. When someone on a laptop set to 125% DPI views their email, the images will stay the same size, but the font’s and table cells may increase in size.

With the common use of header banners, this combination usually results in the banner image being smaller than the 125% banner area, and if you have a background color within your banner area, that will show through.

A good work-around here is not to use full banner images as the header. One option is to use a smaller left or right aligned image (such as a logo), or have the banner graphic inside of a header, so the background color forms a flexible frame around the centered image. The image still won’t scale, but the alignment won’t look off.

Changing your display settings to 100% scale and layout before you begin composing your message may also solve this problem.