Background image not showing in safari

[Sarfaraj]

I am working on a responsive design and the class “mid-column” is having a background image but it is not showing on safari on all the devices.

.mid-column{width:290px; height:500px; padding:0; margin:0 5px 20px 0; float:left; background:#FFFFFF url(../images/box-grdnt.jpg) repeat-x bottom; border:#999999 solid 1px;}

[Paulie_D]

Do you have a live link?

[Sarfaraj]

No I have no link. I have only codE.

[Paulie_D]

Perhaps a Codepen?

[Sarfaraj]

[Check this](http://jsfiddle.net/NCqrE/1/ “http://jsfiddle.net/NCqrE/1/”)

[Senff]

The image won’t show because it’s not an absolute path. On your Fiddle for example, you just called it as ../images/box-grdnt.jpg so it tries to get http://fiddle.jshell.net/NCqrE/1/images/box-grdnt.jpg — which obviously doesn’t exist, so it won’t show.

Not saying that’s the problem (cause this would also have the same result in all other browsers, not just Safari), but in your fiddle that’s what’s wrong so we can’t reproduce it.

[Catherine]

Hi Guys, can you help please ?

I’ve just finished my new website and testing it in all browsers. It works fine in Chrome, Firefox and IE but in Safari the background images and many other images on the page do not show. This happens on some pages of my site, but not all. I have a Windows OS and the version of Safari is 5.1.7 .

I have noticed in the code view that one part of the <section id =” aboutArea”> is underlined green on the pages which don’t work properly. If I hover mouse over that green underlined warning bit, the following text appears:

“If one or more absolute – position elements are placed within a relatively positioned element with no assigned dimensions, either no scroll bar will appear at all, or it will not indent far enough to view all of the content. (Note : this bug will not affect your page if the content in the AP element does not extend beyond the height of view point. Affects: IE 6.0 likelihood: possible.”

http://www.mongolia.co.uk home page does not show background images in Safari.
http://www.mongolia.co.uk/mongolian_visa.html works OK even in Safari and there is no green underlining of the code.

Thank you

[Senff]

If it ONLY happens in Safari for Windows, is it worth spending time on? That’s a “dead” browser — usage is extremely low, Apple doesn’t even update it anymore.

If your user stats show that there’s still a lot of Windows users accessing your site using Safari, then you could look into it…but I doubt it.

Having said that — I went to your site (using Safari), and I wanted to inspect the code to see what could be wrong. However, upon right-clicking, I got this annoying “This image is copyrighted” popup. So much for a quick-and-easy debug, then.

But I DO see the background images.

[Catherine]

Hi Senff,

Thanks for your time.If no one with a Windows OS will use Safari then I can relax. But still hope that genuine Safari users can see my site correctly.

I just want to explain that the reason why we’ve put the annoying copyrighted image is beause so many other travel companies try to copy our photographs, as well as the words and text on our site.

Thanks again.

[Author]

Posts