fn79
fn79

Reputation: 303

css background does not work in safari

The following style applied to body tag does not work in safari. The issue is with the color #faf5ef. It shows black in safari (v 5.1.7). Could anyone suggest what the issue could be and how to fix it?

 body {
    background: url(images/body_bg.png) no-repeat top center #faf5ef;   
    padding:0px;
    margin:0px;
}

Upvotes: 1

Views: 8636

Answers (3)

Riskbreaker
Riskbreaker

Reputation: 4791

I am pretty sure your issue is the PNG

Try going to an image editor(like Photoshop) and making the bg into a bigger width(I assume you have it at 1px-10px) like 20px-25px...

Also saving them as non-interlaced png helps.

Looking at your image it looks like its transparency so remove the transparency.

And have it the right height.

Try that.

HEre is an example of an working image (jpg) http://cssdeck.com/labs/68urshrp

This works (on iPad) so it shows the png needs edit

Upvotes: 0

Jayram
Jayram

Reputation: 19578

change this line

background: url(images/body_bg.png)

Use like this

background: url('images/body_bg.png')
background-repeat: no-repeat;
background-position: center top;
background-color: #faf5ef;

Upvotes: 1

pilsetnieks
pilsetnieks

Reputation: 10420

Change the order of parameters like this:

background: #faf5ef url(images/body_bg.png) no-repeat top center;

Color at the end isn't a standard way anyway and it's a small miracle it works anywhere else.

In general, with the shorthand background property the values should be in this order:

background: color image repeat attachment position;

Any of them could be omitted but they still should be in the same order.

Upvotes: 1

Related Questions