Problem with "object {display: block}"

and the annoying gap in Mozilla etc

[Patrick Taylor]

I've used object {display: block} in my stylesheet to remove the annoying few pixels of space that Mozilla, Firefox, and Opera show below a div containing an object - in this instance a Flash file (the object) brought in via an external js file. I want the next div right up against the one containing the js file, which I achieve in IE but not in those three other browsers. It works, but...

... for some strange reason the <h1> and <p> tags above the first div don't display their font colour in IE6. They're there, but invisible. Very odd.

Can anyone throw any light on this? Is there another way to remove that really annoying few pixels gap below the first div? Margins and paddings are all set to zero.

[createErrorMsg]

{display: block}

This may just be a post typo, but you're missing a semi-colon, which could cause browsers (especially complaint browsers like the one's you mention) to ignore hte rule completely.

[Patrick Taylor]

Yes, I used the semi-colon, even though I didn't realise it made any difference at the end. I've now implemented:

* html #content h1 { height: 1%; }

... an IE hack that seems to fix the problem where an unrelated and higher tag - in this case <h1> - was showing the text color the same as the background - though why

object { display: block; }

would trigger off the problem I have no idea.

[drbrain]

The final semicolon is always optional.

The object gap is probably this:

[devedge.netscape.com...]