...

View Full Version : IE CSS Compatability Issue



baaaan
10-04-2006, 11:45 PM
I'm having one hell of a time trying to get the div labelled "topleveler" on this page to maintain a height of 8px in Internet Explorer.

http://www.dbxlabs.com/fopt/index2.php

Can anyone pinpoint what I'm doing wrong? The only thing in the page that prevents it from validating as CSS is the _height property, but even removing that does nothing to fix the problem.

Any help would be greatly appreciated.

Thanks,

Brandon

_Aerospace_Eng_
10-04-2006, 11:49 PM
A div by default is already display:block; so no need to specify it again. Same goes for other divs. Problem with IE though is its accounting for line-height and sometimes font-size so this

#topleveler {
width: 692px;
height: 8px;
display: block;
background-image: url('assets/topleveler.gif');
}
should be this

#topleveler {
width: 692px;
height: 8px;
line-height:0px;
font-size:0;
background-image: url(assets/topleveler.gif);
}
Its also advised not to use quotes around your image names in css backgrounds because it may not show up on some browsers. Don't use the underscore hack just to feed css to IE6. There are better ways.

* html #contentdiv {
height:500px;
}
or you can use conditional comments (http://www.quirksmode.org/css/condcom.html) to feed it an IE only stylesheet

<!--[if lte IE 6]>
<style type="text/css">
#contentdiv {
height:500px;
}
</style>
<![endif]-->
IE7 RC1 supports min-height and does not support the * html hack when its running in standards compliant mode.

baaaan
10-05-2006, 12:41 AM
Excellent! Thank you so much!



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum