Solved

No Background in FireFox, Works Well in IE

Posted on 2010-11-14
8
383 Views
Last Modified: 2012-08-13
The attached code works in IE but not Firefox.

I even tried adding the following but it still won't work:

background-attachment:fixed;
height: 100%;
width: 100%;
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 

<html xmlns="http://www.w3.org/1999/xhtml"> 

<head>

<title>untitled

</title>

<style type="text/css">



/* image background style */



html, body { height: 100%; width: 100%; background-attachment:fixed; background-image: url('C://Documents and Settings/Administrator/My Documents/My Pictures/snow-mountain-wallpapers_22126_1440x900.jpg'); background-repeat: no-repeat; }



</style>



</head>

<body>

Hello

</body>

</html>

Open in new window

0
Comment
Question by:EMB01
  • 2
  • 2
  • 2
  • +2
8 Comments
 
LVL 14

Expert Comment

by:ali_kayahan
ID: 34132766
Can you please try this one, absolute path with spaces wont work in web also
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 

<html xmlns="http://www.w3.org/1999/xhtml"> 

<head>

<title>untitled

</title>

<style type="text/css">



/* image background style */



html, body { height: 100%; width: 100%; background-attachment:fixed; background-image: url('Pictures/snow-mountain-wallpapers_22126_1440x900.jpg'); background-repeat: no-repeat; }



</style>



</head>

<body>

Hello

</body>

</html>

Open in new window

0
 
LVL 14

Author Comment

by:EMB01
ID: 34132836
Sorry, that doesn't work.
0
 
LVL 14

Expert Comment

by:ali_kayahan
ID: 34132845
where is your background picture (snow-mountain-wallpapers_22126_1440x900.jpg) ? Is there a link to this page ?
0
 
LVL 22

Accepted Solution

by:
remorina earned 200 total points
ID: 34133212
Hi EMB01,

The background wou'dnt work correctly because you're refering to it as a file path, Explorer would work because it's a part of windows and understands the path, while other browsers might not work because the path isn't in a web acceptable form.

As a rule, you should avoid referring to images in my documents or any system folders, also saving the html file in a folder and saving the image in the same folder and refering to the image directly will work with no problems however, if you browse to the image and drag it to the browser, copying the url from the browser's address bar is what you would need in order for it to work correctly in this method.

I assume it should be something like this
html, body { height: 100%; width: 100%; background-attachment:fixed; background-image: url('file:///C:/Documents%20and%20Settings/administrator/My%20Documents/My%20Pictures/snow-mountain-wallpapers_22126_1440x900.jpg'); background-repeat: no-repeat; }

Open in new window


But once again you should avoid using such paths in CSS, and it also wouldn't work at all if you upload the html file online or take it to another PC.

Hope this helps
0
Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

 
LVL 4

Assisted Solution

by:lordrt
lordrt earned 25 total points
ID: 34134146
Why not put the background image where your css file is found (same folder), thus no need to use paths then, just call it as
 background-image: url ('imagename.jpg');
0
 
LVL 4

Expert Comment

by:lordrt
ID: 34134156
else if you want to use path, it should be the site's path instead of the drive path, like for example
background-image: url ('http://www.mysite.com/files/image.jpg'), but yet again the image must be found in the folder containing the css + other files on the server
0
 
LVL 2

Assisted Solution

by:wasim117
wasim117 earned 25 total points
ID: 34135165
you can put the image in the same folder as CSS then add image-background
html, body { height: 100%; width: 100%; background-attachment:fixed; background-image: url('snow-mountain-wallpapers_22126_1440x900.jpg'); background-repeat: no-repeat; }

Open in new window


that path is creating issues with Firefox.
0
 
LVL 14

Author Closing Comment

by:EMB01
ID: 34140601
Thanks, I could put it on the desktop alternatively but I was just wondering why it wouldn't work as is.  I've never used the file:// protocol before...  interesting.
0

Featured Post

Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Use these top 10 tips to master the art of email signature design. Create an email signature design that will easily wow recipients, promote your brand and highlight your professionalism.
Is your Office 365 signature not working the way you want it to? Are signature updates taking up too much of your time? Let's run through the most common problems that an IT administrator can encounter when dealing with Office 365 email signatures.
In this tutorial viewers will learn how to style a decorative dropcap for the first letter in a paragraph using CSS. In CSS, create a new paragraph class by typing "p.fancy": Then, to style only the first letter of the first sentence, include the ps…
In this tutorial viewers will learn how to embed an audio file in a webpage using HTML5. Ensure your DOCTYPE declaration is set to HTML5: : The declaration should display (CODE) HTML5 is supported by the most recent versions of all major browsers…

863 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

24 Experts available now in Live!

Get 1:1 Help Now