Background via CSS...

liunx

Guest
I've included the following in my CSS, but can't see the background image...only the color:

body
{
background: url("gfx/stucco.jpg") #ffe47a 50% repeat fixed;
}

Am I missing something?

Thanx.body {
background : #ffe47a url("gfx/stucco.jpg") repeat fixed 50% 50%;
}

Is fine double-check your filename and path.Hmm...

Still only color...no image.

Does this only work if the site is based "online" as opposed to working directly off of a mapped drive?

Thanx.It works anywhere as long as the path is correct CSS is client-side.Interesting.

I'm working directly off my hard drive, within a sub-directory of "web" and there is a sub-directory of "gfx" immediately under "web."

Is it just because it's Monday?

:DActually, I noticed that both IE and Gecko have trouble with shorthand background property when it contains both color and URL. Following fixes the problem:
body
{ background : url('gfx/stucco.jpg') repeat fixed 50% 50%;
background-color: #ffe47a;
}Sheesh!

This is just too bizzare!!!

Here's my code now:

body
{
background: url("gfx/stucco.jpg") repeat fixed 50% 50%;
margin: 0;
padding: 0;
}

Now...I've even removed the color and I still can't see the background...it's just plain white.

Weird.

Thanx.

P.S. Showing the same in IE6, N7.1, M1.6, MFF0.8, and O7.11.Try it without the quotes.It is likely, as Robert already implied, that the path to your background-image is incorrect. Remember that the path is relative to where your stylesheet is located, so what it comes down to really is: where is the stylesheet located and what exactly does your directory structure look like? What's happening is probably something like this:+ root
- index.html (styled via css/style.css)
+ css
- style.css (incorrectly referencing gfx/stucco.jpg)
+ gfx
- stucco.jpgPoint being, the file you're pointing to is invalid. If your directory structure is similar to the above, you'll have to change your image reference to: ../gfx/stucco.jpg instead or move the gfx directory into your css directory.

Moreover, as Ray already noted, it would be smart to remove the quotes around the filename since they are not required and only raise more problems seeing that some browsers behave very oddly and in some cases don't even parse the rule altogether when they are present.Do you have it set as "background-image" and not just "background"? Out of all the code you posted from what I can see your using "background" when you should be using "background-image". Not sure if you already have that but from the code you posted I don't see that. Hope that helps. :)Ooooooooooooooooooooooooooooooooh.

Thanx, FredMV.

I thought the image location was relative to the XHTML, but it is relative to the CSS. I modified the url(path) to be relative to the CSS and it's working great now.

Yep...it's Monday.

:D

Thanx. guyz.No problem! That's pretty confusing stuff. ;)
 
Back
Top