background-image & mails

  
I want to make a nice mail with a heading with a background.

This is not working very smoothly...  :-(

During design it was not possible to get that image as a background (it was as if the image was not found : background coloring was working without problems and the link to the image was correct (it was dragged) ).

When I made a webscreen with a div that uses the same background (to check if this maybe only works in webscreens) the background was there without any problem.  And...  suddenly the background in the mail became visible.  (?)

So the design of the mail was ready (with a little hack because when I remove the webscreen the background in the mail is gone).  

The result in the mailbox however...  is still without background image.

Anyone with an idea how to get background images in mail div's ?


Can you share your code? It's not quite clear how to actually create the mail. What exactly do you use to create the mail?
I think you'll also have to pass the complete url of the image otherwise the mail client will not be able to show it. But I'm not completely sure. To test.

I created a little webscreen (MailProblem/Screen Flows/MainFlow/TheWebscreen) with a button that sends an email (MailProblem/Screen Flows/Emails/TheMail).

In this mail I used some CSS (

.DivWithBackground {
    width: 200px;
    height: 200px;
    background-image: url(http://www.space.com/images/i/000/005/972/i02/sun-photo-solar-filament-101118-02.jpg);
    background-size: 100%;
}

to create a div with a background (refering to a public image at http://www.space.com/images/i/000/005/972/i02/sun-photo-solar-filament-101118-02.jpg )

But when I receive the mail... there is no image...

:-(




Hi Bob,

Haven't found the cause yet, but when I take the body of the email and paste it into a html file, it works fine (see attached file). Even viewing the email directly in the browser works (I'm using hotmail and my company mailbox)

But perhaps this post might help: http://stackoverflow.com/questions/28854524/setting-a-background-image-on-an-html-email-for-hotmail-outlook. Looking at other post in the inernet, I'm wondering if it's even supported.

Hi Bob,

As Kurt said, it's problem with Outlook and other email clients, please find bellow a few url's that explain the issue and provide a solution, the workaround involved not only adding a background image to the entire HTML page, but wrapping all content in a table with a background image applied to it:

https://backgrounds.cm/
https://www.campaignmonitor.com/blog/how-to/2010/07/add-a-background-image-to-individual-table-cells/

Hope it helps you.

Best regards.