Image not showing in IE6

[jpkuelho]

just started this simple CSS , it just has 3 background images and one logo gif which is not showing on IE6

body {   margin:auto;   }   a {	border: 0;}   #bg1 {   float:left;   background-image:url("images/bg/bg_01.jpg");   width:1024px;   height:237px;   }   #bg2 {   float:left;   background-image:url("images/bg/bg_02.jpg");   width:1024px;   height:237px;   }   #bg3 {   float:left;   background-image:url("images/bg/bg_03.jpg");   width:1024px;   height:237px;   }   img.logo {	float:left;    z-index:1;	position:absolute;	left: 88px;	top: 158px;	}            

[aspnetguy]

it is working in other browsers? Remove the quotes from the url()

[S@m]

put a position:relative; on your floats. IE has a peek-a-boo bug (I mean feature) that is pretty sweet.

[jlhaslip]

bug = "undocumented feature"

[aspnetguy]

bug = "undocumented feature"

LOL That reminds me of a saying the C programmers had in college."My programs don't have bugs they just develop random features"

[jpkuelho]

Thanks guys :Dit worked now I just have to reposition it on IE I added an html>body hack(its a hack right?) but I think now my CSS won't be validated ;~~

[croatiankid]

it will because it's valid css, just that ie6 (and maybe 7, not sure) ignore it.

[jpkuelho]

ok now the problem is that IE expands the height of the document so it creates a white space after the end of the backgroundI know the problem is with the logo image I just don't know what to do to fix it

img.logo {	position:relative;	left: 88px;	bottom:550px;	width: 99px;}   html>body img.logo {	position:absolute;	left: 88px;	top: 158px;	bottom:auto;	width: 99px;	height:230px;	}

the white space is the same height as the logo ¬¬'