...

View Full Version : Background Image Problem



haveacigar
02-03-2007, 08:43 PM
Hey, I am having a problem with a background image. It works fine in ie but doesnt show up in firefox. The thing is the quadbike in the right hand corner
( http://www.alanmonger.co.uk/keypitts )

Here is the css


/* CSS Document */

a {
color:#000066;
text-decoration:none;
font-size:1.4em;
}
a:hover
{
color:#009900;
}
#container
{
width:775px;
position:relative;
background:url("images/quad.jpg") no-repeat bottom right;
}
#images
{
float:right;
margin: 0 10px 0 10px;
width:320px;
height:auto;
border-style:solid;
border-width:1px;
margin-top:5px;
}
#content
{
width:425px;
float:left;
border-left:solid;
border-width:1px;
border-color:#999999;
padding-left:5px;

}
#header
{
width:775px;
background-color:#ffffff;
margin-bottom:15px;
}
a img
{
border:none;
display:block;
}

Thanks for any help :thumbsup:

haveacigar
02-03-2007, 10:07 PM
anybody?

drippin
02-03-2007, 10:17 PM
try using this instead:

#container
{
width:775px;
position:relative;
background-image:url("images/quad.jpg");
background-repeat:no-repeat;
}

see if that works.

haveacigar
02-03-2007, 10:20 PM
Unfortunately not... but thanks anyway.

I dont know why but i am also unable to change the color..

drippin
02-03-2007, 10:30 PM
hmmm ok, last suggestion...

#container
{
visibility:visible;
position:absolute;
width:900px;
top:12px;
left:12px;
height:200px;
background-image: url(/images/quad.jpg);
background-repeat:no-repeat;
}


Im guessing you know what to do with Width, Top, Left and height?

haveacigar
02-03-2007, 10:52 PM
Still no :( i dont know why its not working properly in ff but perfectly in ie :(

drippin
02-03-2007, 11:53 PM
hmmm strange... i my experience its usually the other way around.
When you say "not working properly" is it actually showing something? or is the div not displaying at all? Im guessing container is a div anyway...

Shoot2Kill
02-04-2007, 02:59 AM
i am not sure of the problem, but having no positioning on header div, and with it being same width as container, could the header be blocking the quad background image.. ??

drippin
02-04-2007, 03:52 AM
It could be, but if he's used TOP to plot where the div is, there should be no reason its blockin it... but thats if they've used TOP.

They could always use Z-index to force the container infront i suppose.

hmmm, maybe adding. Z-index:10; could do the trick, but personally i dont really use Z-index that much, so im not sure about this.

Arbitrator
02-04-2007, 04:49 AM
You need to clear your floats: div#container { overflow: auto; }.


i dont know why its not working properly in ff but perfectly in ieThis is actually a flaw in Internet Explorerís float model, not the other way around.


Containing Floats (http://www.complexspiral.com/publications/containing-floats/) explains how the float model works.
Clearing Space (http://css-discuss.incutio.com/?page=ClearingSpace) provides a list of methods that can be used to clear floated elements.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum