Last active
October 3, 2019 16:09
-
-
Save fivedoor-gists/9e9dc38390626c5aad9bd4f3062c9109 to your computer and use it in GitHub Desktop.
email-background-image-retina
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <td style="background:url(img-x2.jpg) center/cover;background-image:url(img-x2.jpg); background-size:100%;background-size:cover; background-position: center center" bgcolor="#######" valign="top" height="####" > | |
| <!-- https://litmus.com/community/discussions/4931-using-retina-images-as-background-images?utm_campaign=bestpractices_retinaimages&utm_source=litmusblog&utm_medium=blog#comment-7300 | |
| The reason it's set twice is Gmail will strip background-size but it's happy to have it in shorthand. Android 4.x doesn't like shorthand background so you have to write it all out in longhand. And I've set the background -size twice as cover tends to do a better job but 100% has better support. | |
| If you have a background set as an HTML attribute (background="img-x1.jpg") you have to use regular sized non-retina images. You can use retina images in VML markup. You just have to set your fill type to frame. What ever image you're using as your fill will stretch to the dimensions of your rectangle. --> | |
| <v:fill type="frame" src="image2x.jpg" /> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment