it seems that on Firefox and IE, even for standard compliance mode, the following code will give different result: <div style="border:1px solid orange; width:300px"></div> HTML: on IE 7, the div will have a height of "line-height", but on Firefox 2, the div will have zero height. When the width:300px is removed, then it is zero height on both IE 7 and Firefox 2... any method to make them consistent? Zero height is wanted when the database returns empty string for within the div. Thanks very much!
I'm pretty sure the difference between a width and no width is Haslayout Which would explain why it's only occuring in IE. I would not be surprised to hear IE6 coulod do this too-- in IE, line-height is considered height (incorrectly). So, if you were to have any empty divs like this (and you wouldn't on a real site, would you?), keeping Haslayout from being triggered (floating, positioning, giving a height or a width, a few others, see haslayout.net click Haslayout in the menu) keeps the div collapsed as it should be. Cheers, poes
hm, it seems like there are 2 solutions: 1) don't show the div at all when the string is empty (the border was only for debug purpose and not needed) 2) or, this div is inside another div with width of 600px, so i can set this inner div to have no width, but just a margin-right of 50px or something like that. I tested both solutions and they worked in both IE 7 and Firefox 2.