Solved

No Background in FireFox, Works Well in IE

Posted on 2010-11-14
8
425 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
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 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
Independent Software Vendors: We Want Your Opinion

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 
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
 
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

On Demand Webinar: Networking for the Cloud Era

Ready to improve network connectivity? Watch this webinar to learn how SD-WANs and a one-click instant connect tool can boost provisions, deployment, and management of your cloud connection.

Question has a verified solution.

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

This is a PowerShell web interface I use to manage some task as a network administrator. Clicking an action button on the left frame will display a form in the middle frame to input some data in textboxes, process this data in PowerShell and display…
Finding original email is quite difficult due to their duplicates. From this article, you will come to know why multiple duplicates of same emails appear and how to delete duplicate emails from Outlook securely and instantly while vital emails remai…
In this tutorial viewers will learn how to code links for mobile sites that, once clicked, send a call or text to a specified number. For a telephone link (once clicked, calls a number), begin with a normal "<a href=" link tag. For the href, specify…
The viewer will the learn the benefit of plain text editors and code an HTML5 based template for use in further tutorials.

691 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