CODEWITHSUNDEEP
htmlcsspngbackground-image
Sam Friday Welch
Sam Friday Welch

Reputation: 255

Background image working in Firefox & Explorer, but not in Safari or Chrome

I have used a background image for my body, which shows perfectly in Firefox & Explorer, but does not show at all in Safari or Chrome. The code for the body background image is showing below:

html

<body>

css

body
{
background:url('misc/body2.png') no-repeat;
background-size:100%;
-webkit-background-size:100%;
-moz-background-size:100%;
-o-background-size:100%;
-ms-background-size:100%;
overflow:hidden;
font-size:100%;
}

Chrome & Safari just show a blank page with the above code, whilst Firefox & Exploer both show the image at full size as intended. Does anyone know where I am going wrong? There is no other code written as of yet, so nothing else could be effecting the above

Upvotes: 0

Views: 1124

Answers (1)

Adam Bartz
Adam Bartz

Reputation: 249

I changed the background size to simply be auto, and it appears to be working just fine in Chrome, IE, and Firefox (don't have Safari to test). Here's the fiddle.

body
{
   background:url('misc/body2.png') no-repeat;
   background-size: auto;
   overflow:hidden;
   font-size:100%;
}

Upvotes: 2

Related Questions