ios - SVG background image not appearing on iPad -


i'm having strange problem background on site. i'm using multiple background images; there's 4 photos , svg of angled shapes goes overtop of images , frames them. css body background

body {     background-color: #bbe2de;     background-image: url('/img/mobile-bg-exorcised.svg');     background-position: top center;     background-repeat: no-repeat;      color: #2a2a2a;      font-family: "ff-din-web";     font-size: 16px;     line-height: 1.4em; } @media screen , (min-width: 600px) {     body {         background:              url('/img/desktop-bg.svg') top left,             url('/img/bg-photo-4.jpg') 849px 4460px,             url('/img/bg-photo-3.jpg') 0 3948px,             url('/img/bg-photo-2.jpg') 617px 980px,             url('/img/bg-photo-1.jpg') 0 186px;         background-repeat: no-repeat;     } } 

it displays on desktop browsers, on ipad svg doesn't show @ all. rest of images show fine. i'm using svgs background images elsewhere on site , display fine, don't think it's server issue mime type.

here's link site, live: http://johnkatimaris.thesmackpack.com/

and here's svg file in question in case think there might wrong specifically: http://d.pr/f/2vp4

any ideas why it's not working?

i've run problem again on different site different svg file , had same issue. seems there's kind of undocumented limit how tall ipad display svg. doesn't make sense , don't think it's case it's thing can think of, since making image shorter fixes in both cases.


Comments

Popular posts from this blog

c# - How Configure Devart dotConnect for SQLite Code First? -

java - Copying object fields -

c++ - Clear the memory after returning a vector in a function -