StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

PObackground-image is not displayed in iphone
text
Body
copied!<p>I don't know why the 'background-image' I set works fine in all browsers but it doesn't in Iphone's safari browser (wich is the one I need),</p> <p>This is the relevant style for the question</p> <pre><code> /************************************************** ESTILOS PARA SINGLE JOB **************************************************/ /*Deleting all styles that dont take any effect with the question*/ #panel.right ul.visible li a span.liLeft{ width:95px; float:left;height:100%;display:block; position:relative; right:40px; /*HERE I INIT THE STYLE OF THE BACKGROUND IMAGE BUT I DONT SET THE URL*/ -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; z-index:10; } #panel.right ul.visible li a span.liRight{ background:black !important; color:#fff; } #panel.right ul.visible li a span.liRight{ z-index:9; } #panel.right ul.visible li#blue a{ border-color:#0C7CC3; } #panel.right ul.visible li#pink a{ border-color:#C21B7B; } #panel.right ul.visible li#orange a{ border-color:#E83B35; } /* HERE i set the urls for the different Id's and i can't see them in the iphone */ #panel.right ul.visible li#blue a span.liLeft{ background-image:url('http://piscolabis.info/licht/img/azul.png'); } #panel.right ul.visible li#pink a span.liLeft{ background-image:url(../img/rosa.png); } #panel.right ul.visible li#orange a span.liLeft{ background-image:url(../img/naranja.png); } /* deleting more styles*/ </code></pre> <p>you can check the online code at <a href="http://jsfiddle.net/6dK3T/2/" rel="nofollow noreferrer">http://jsfiddle.net/6dK3T/2/</a> or at <a href="http://piscolabis.info/job_single.html" rel="nofollow noreferrer">http://piscolabis.info/job_single.html</a></p> <p>As you can see i set a full path URL only so you can see that the image is in the server (and in any desktop browser), but i don't know why the image is still not displayed in the iphone</p> <p>( it's displayed exactly like the other two i didn't set absolute path (and as they are not in jsdfiddle they don't work))</p> <p>Is it because of the background-image? is it because the position:relative? </p> <p>any idea why is this happening? </p> <p>-EDIT-</p> <p>should look like this</p> <p><img src="https://i.stack.imgur.com/9VkvF.jpg" alt="enter image description here"></p> <p>Isn't this like a mistery?</p>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload