Whacky Unwanted Transparency

Firefox Bug?

[cmarshall]

I have a "pseudo-window" that is a <div> with a high z-index over another <div>.

The top <div> has a white background and some floated <divs> inside of it that form a list. At the bottom of the top <div> is a "clear" <div>.

Now, there's a strange thing that happens: There's a link in the top <div>. If I click on that link, the floated <div> elements just below the link suddenly get transparent, and show bits of the underlying <div>.

It's a fair amount of code to post, so I hope this description is sufficient.

Does this sound familiar?

[Robin_reala]

Can’t say I’ve seen this before. Can you strip it down to the bare minimum and post that? If nothing else, it might help you find out why it’s working the way it is...

[cmarshall]

Well, I figured out how to prevent it happening, but I don't think it's fixed.

However, I'm pretty sure that it has to do with a position:fixed property and a negative margin.

I had a <div> offset with a negative margin inside another (hi-z) <div> with a white background.

I don't want to spend the time to distill it right now, but, as I said, I was able to "fix" it by rearranging the nested <div> elements so that the negative margin was no longer necessary.

Firefox does seem to have some strange reactions to positioned elements. I know that if I position my elements absolute, Firefox will only ever print the first page of a window.

[Robin_reala]

Yeah, there are some printing bugs with Gecko & positioned elements. Actually, Gecko’s printing isn’t very good full stop.

I’ve certainly not come across any major bugs with positioning and negative margins though (well, not since Firefox 1.5 came out).