Gmail removes background-size in my newsletter

css, gmail, html, newsletter

Solution

I worked around this by using the background css shorthand method. Define the image, repeat, and size all in one line like so:

background: url({{ item1.picture }}) no-repeat top / 100% auto;

Notice that the size attribute should be defined after the position attribute ('top') and delimited with '/'.

Problem

I have an email newsletter, that contains product pictures of the products, which are promoted via newsletter. I use full size pictures and resize them with: ``` <table cellspacing="0" cellpadding="0" border="0" style="width: 201px; height: 240px; background-image: url({{ item1.picture }}); background-repeat: no-repeat; background-size: 100% auto;"> ``` Gmail strips the ``` background-size: 100% auto; ``` tag and the pictures are shown in their full size. Is there any way how to fix this? I don't want to resize each picture on the server side.

Original source

Related problems