Well rather than complicating matters and typing that full file path to your user name you’d be better using a relative path. Are you following one of the Ian Lloyd’s SitePoint books by any chance as that code looks familiar?
#navigation {
width: 180px;
height: 484px;
background: #7da5d8 url(backgrounds/nav-bg.jpg) no-repeat;
If you are using that book, you will probably have a folder called “Web” and one folder inside that one called “backgrounds” where the nav-bg.jpg should go.
Else if you are using your own directory structure then substitute the ‘backgrounds’ folder name for ‘images’ or whatever folder the image is actually residing within.
Yes! I did get it from Ian Lloyd’s SitePoint books. That code is exactly what I’m trying to do. I think I had this set up incorrectly from the get go.
I’ll try to make some changes and see what happens.
THanks let me get back to you.
No worries, you should have mentioned you was a “newbie” working from Ian’s book because a lot of the people answering here won’t have that book. So will have to guess what really you were after.
With me being orange and a lot of people asking questions on this book I have access to it for this very reason, so I can give faster replies.
Your problem may be that you originally wrote:
background-color: #7da5d8 url(C:\Documents and Settings\Bruce Canales\My Documents\Web\images
av-bg.jpg)
When you really meant:
background-color: #7da5d8;
background-image: url(“C:\Documents and Settings\Bruce Canales\My Documents\Web\images
av-bg.jpg”);
Inside the ‘My Documents’ folder you should have a folder called ‘Web’ to place your HTML page and inside that folder. Make sure you have one called ‘backgrounds’ inside the ‘Web’ folder; you should have the image itself inside the ‘backgrounds’ folder - double-check your spellings.
So the folder structure is a little like: My Documents > Web > backgrounds
If you directly opened the image file itself in Firefox it probably would look like the following in the address bar: file:///C:/Documents%20and%20Settings/Bruce%20Canales/Desktop/My%20Documents/Web/backgrounds/nav-bg.jpg
I suspect if it isn’t showing you have the image in the wrong directory or have made a typo. Thus try copy-and-pasting the multicoloured “CSS Code” example here into your CSS file overwriting those few CSS lines you originally had posted in #1
If it still doesn’t work then post the full XHTML and CSS files just to make sure it is only a path issue and not a simple syntax problem elsewhere.
Success!! THanks everyone!!
Robert, you were right. My path was not defined correctly. After straightening that out and adding the code you provided it worked.
No worries Bruce, it’s a extremely common mistake when learning XHTML and CSS and make sure you use ‘relative’ paths. Rather than all those pointless long user name string paths when writing the pages.
As it is easier and shorter to write, e.g. ‘backgrounds/nav-bg.jpg’ and more portable should you ever want to upload or move these files to another computer or web server, etc.
