Background Image wont display

Forum Moderators: not2easy

Message Too Old, No Replies

Background Image wont display

valegooner

1:40 pm on Jun 25, 2004 (gmt 0)

I'm trying to setup a website using <div> and css rather than tables - my layout is fairly simple with three main areas - two of which i want to have background images. But IE 6.0 won't display the images (or apparantly even download them) - I have put a thin red border around the divs as suggested and it appears, so the divs aren't collapsing. I'm not entirely sure that absolute positioning is the right way to to but given that the divs will contain images of a given size it would seem suitable to me. I include the CSS for one of the divs and the HTML for the page below.
Thanks,
Alex

CSS:
div#top {
background-image: url(/images/topmenubar.jpg);
position: absolute;
left: 0px;
top: 0px;
width: 451px;
height: 161px;
background-repeat: no-repeat;
border: 1px solid #FF0000;
visibility: visible;
}

HTML:

</body>
</html>

4css

2:04 pm on Jun 25, 2004 (gmt 0)

Hi valegooner, welcome to WebmasterWorld.

I took your code and placed it on my pc, the following css is what I used (replaced the image with one of my own) and it worked for me.

Here is what i used
div#top {
background-image: url(dkblclds.jpg);
position: absolute;
left: 0px;
top: 0px;
width: 451px;
height: 161px;
background-repeat: repeat;
border: 1px solid #FF0000;
}

(I used repeat due to the graphic that I used on mine.) Do you have the url correct? This is the only thing that I can think of that would be causing the problem for you.

JayCee

3:52 pm on Jun 25, 2004 (gmt 0)

I just did a "background-image" for the first time and found i needed quotes around the path. Some references show them, some do not, but i got no image until i used quotes. My code looks like:

background-color:#ffffff;
background-image:url("images/layout/Masthead-2004c_01.jpg");

Note the word-wrap in this posting on the 2nd line.
Mine is part of a "div id" and is used inside a simple table.

The color shows up in case the image does not.

4css

4:00 pm on Jun 25, 2004 (gmt 0)

Here is some information on the background image usage in css for you

[w3schools.com...]

[w3.org...]

And this one explains that the usage of a single quote or double quote is optional

[w3.org...]

I hope that this helps you out a bit.

Also, make sure you have your style sheet linked correctly if its a linked, and if embeded, that its embeded correctly.

natty

11:44 pm on Jun 25, 2004 (gmt 0)

i may be a bit late on this one, but it looks like you have the path to the images directory as /images/blah.jpg

try dropping the first slash? if your css is in the root.
if no tthen plz ignore ;-)
hth