I've embeded an svg image in to an html email. It displays on iphone and desktop mac mail aplication but is nt showing on my Mobileme web mail. Any ideas why? This is the code
<object data="http://www.jamesgrubb.co.uk/img/rclogoSmall.svg"
type="image/svg+xml"
width="200"
height="50"
style="display:block; overflow: hidden;"
pluginspage="http://www.adobe.com/svg/viewer/install/">
<img src="http://www.jamesgrubb.co.uk/img/rclogoSmall.svg"
alt="Red Cloud"
style="width:200px; height:50px; "/>
</object>
If you are trying to use SVG like <img src="image. svg"> or as a CSS background-image , and the file is linked to correctly and everything seems right, but the browser isn't displaying it, it might be because your server is serving it with an incorrect content-type.
SVG as Inline HTML If you were hoping the CSS properties for SVG are also supported for those email clients that recognize inline SVG, well, you're in luck. They are, across the board.
As there is no native support to embed SVGs in an email, it is better to use . PNG files as signatures as they are supported by all email operators.
SVG images can be written directly into the HTML document using the <svg> </svg> tag. To do this, open the SVG image in VS code or your preferred IDE, copy the code, and paste it inside the <body> element in your HTML document. If you did everything correctly, your webpage should look exactly like the demo below.
for others that may be curious about this, we ran an email design test including an SVG image. The results were very mixed.
While Webkit-powered clients like Apple and iOS Mail breezed through the test, webmail and most desktop email clients didn't seem to want a bar of it.
Email client support is definitely something to keep in mind before implementing techniques like this.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With