IE6 troubles

[GaVrA]

So thnx to tera i know now how to limit some HTML only to a specific browser, and i did manage to strip down stuff that dont work on ie6 so it does not even try to show it on it(ie6). On all other browser that HTML works...

 

So pls check my site in ie6 and in firefox(or what ever ur using):

 

http://www.crtaci.info/

 

Its almost identical. There is no logo, becouse i didnt add any for ie6. I said almost, couse there is this little gap:

 

 

 

I am using this code for that background, i need it so it would stay fluid, aka to work on all resolutions:

 

<div>
<div id="logo1"></div>
<div id="logo2"></div>
<div id="logo3"></div>
</div>

 

#logo1{ 
background: transparent url(style_images/<#IMG_DIR#>/logo1.png);
float: left;
width: 600px;
	 height: 246px;
}

#logo2{ 
	 background: transparent url(style_images/<#IMG_DIR#>/logo2.png) repeat-x;
width: 100%px;
	 height: 246px;
	 margin-left: 600px;
	 margin-right: 118px;
}

#logo3{ 
	 background: transparent url(style_images/<#IMG_DIR#>/logo3.png);
float: right;
width: 118px;
	 height: 246px;
	 margin-top: -246px;
}

 

 

Thats my html and css for header and footer. Just different numbers and classes for footer... Anyone have any idea why ie6 is making this gap?

[AlexH]

Just for starters, this wouldn't help you :P

 

   width: 100%px;

 

CSS is trying to work out whether you mean 100%, or 100px :) That might be the cause, but I doubt it.

[GaVrA]

That's maybe some leftover from me trying to work something out with this stuff... :D

 

Anyhow, i changed that and still nothing... :)

[GaVrA]

This worked out like this:

 

#logo1ie{
background: transparent url(style_images/<#IMG_DIR#>/logo1.png);
float: left;
width: 600px;
height: 246px;
margin-right: -3px;
}

#logo2ie{
background: transparent url(style_images/<#IMG_DIR#>/logo2.png) repeat-x;
height: 246px;
margin-left: 597px;
margin-right: 118px;
}

 

Right margin of first div goes -3px, and left margin of 2nd div goes also -3px. :)