Background Images

[SimonBahr]

Hi There,

Can someone, by example, show the css for background-image.

I tried this in my style sheet and it wasnt pulling the image through. I think its because I'm listing the url incorrectly can someone demonstrate this?

Cheers

Si :D

[Fang]

#head {
background: #ccc url(header.jpg) no-repeat fixed left;
}

[analaura]

#elementid
{
background-image:url('path/to/myimage.gif');
}

and if in the path you need to go up one folder
{
background-image:url('..path/to/myimage.gif');
}

[Lextar]

I had differences with this between IE and Netscape.

Example
The CSS file is stored in a directory called CSS
The html file is stored in a directory called MyDir contains a link to the CSS above

When using the example code previously posted, one browser (can't remember which)
tries to find the image from the MyDir

while the other browser looks for the image from the CSS directory

I'm wondering if this is me or it is an actual difference in the browser types?

[DaveSW]

If you're still experiencing problems then post your code and where they are in relation to each other.

Don't forget in external stylesheets the url is relative to the stylesheet and not the page itself.

[Lextar]

The code is at

www.lexcore.co.uk/Epic4

but i have php which causes it to be very messy sometimes

css/epic.css
css/images/BGstars.gif
Epic4/index.php3
Epic4/images/BGstars.gif

epic.css contains the code
BODY
{ FONT-SIZE:14px; COLOR:WHITE; FONT-FAMILY:verdana,geneva,arial,helvetica,sans-serif;
MARGIN-LEFT:5%; MARGIN-RIGHT:5%; BACKGROUND-IMAGE:URL("images/BGstars.gif"); BACKGROUND-COLOR:BLACK;
}

index.php3 contains the code
<LINK REL="stylesheet" TYPE="text/css" HREF="../css/epic.css">

the image is duplicated in the both directory because IE uses one and Netscape uses the other
css/images
Epic4/images

[DaveSW]

That is strange. What if you put the image in the css directory? or move the images folder up with the css and epic ones?

[Lextar]

If i remember correctly, everything worked fine in Netscape.

But when I went to IE, no background image was being displayed. Hence the reason I created the image directory in the ccs and copied the image there.

Is there something to do with my page not containing a HTML version tag (reading up on that else-where).

[DaveSW]

it could well be.
Drop a transitional DTD on it.
http://www.webdevfaqs.com/html.php#doctype

[Lextar]

Nope, didn't work. And yeah, Netscape displays the background from
Epic/Images/

while IE seems to want it in
cc/Images/

[DaveSW]

have you tried validating it at the w3c? There might be an error somewhere
http://validator.w3.org/