Can't display CSS Background-images on Firefox or palemoon

clarisse88's picture

They have: 1 posts

Joined: Apr 2012

Hello everybody! I am new in this forum...

I am trying to pull up a CSS background image on a web page. It works on IE, on Google Chrome... but it doesn't work on Firefox nor Palemoon, and I just can't figure out what the error is. I would very much appreciate an answer! thanks Smiling

These are the too codes that I am using (please, note that I am using local images).


<em><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
<style> {
/* Set rules to fill background */
min-height: 100%;
min-width: 1024px;

/* Set up proportionate scaling */
width: 100%;
height: auto;

/* Set up positioning */
position: fixed;
top: 0;
left: 0;

@media screen and (max-width: 1024px) { /* Specific to this particular image */ {
left: 50%;
margin-left: -512px; /* 50% */
<img src="c:/temp/lucia.jpg" class="bg">
<div id="page-wrap">


<style type="text/css">

body{background-image: url('c:/temp/lucia.jpg');}


- Clarisse.

Megan's picture

She has: 11,421 posts

Joined: Jun 1999

Well, the code that's calling the background image (CODE 2) is looking for a file on your computer's hard drive (c:/temp/lucia.jpg). This certainly won't work when you upload the file to a server. I haven't tried it before but maybe some browsers can't handle that at all.

In any case, it's best to put in background images as a relative path (e.g. ../images/lucia.jpg) rather than a hard link to a file on your computer. Full URL's will also work, but might break if the site structure changes.

Want to join the discussion? Create an account or log in if you already have one. Joining is fast, free and painless! We’ll even whisk you back here when you’ve finished.