Hello @jamie.c ,
Ohh great work on keeping things tidy and welcome to the community by the way,
The layout is clean and vibrant, Outlook is just picky with how it handles images because it uses the word engine to render emails.
Here's a solid fix that works, wrap the image in a table and set its width explicitly. Here's the HTML snippet to
Try:
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td align="center" valign="top">
<img src="your-image-url.jpg" width="600" style="display:block; width:100%; max-width:600px;" border="0" alt="Funny Farm Goat Cheese" />
</td>
</tr>
</table>
Replace "Your-image-url.jpn" with your actual image link.
This forces Outlook to treat it right- no padding weirdness, no alignment issues.
Let me know if the issue still shows- but this usually nails it.
Hi @jamie.c
Thank you for reaching out to the community. To add to @MANSIR2094 you might want to check the image width.
Is the image 600px width? If it is smaller than that, the image will not fill the whole frame.
Hey @jamie.c
Great to see you here. Love the branding!
@NicolineLage mentioned, the image should be 600 width.
if it is 600px width, then check:
- your padding in your ‘styles’ section on the template
- padding in the content block
Hope that helps
Posting the full solution below in case anyone else comes across this. Two things helped the issue -
- using HTML code and putting it in a table like suggested by @MANSIR2094
- Removing the block padding on the rest of the elements in the email.. There was block padding on the text box, as well as on the images I had in a split section. I had to remove the block padding from each image as well as between the images.
Removing that padding did mess up the mobile layout so I had to add some image blocks that were mobile only and desktop only.