|
Posted by Ben C on October 10, 2007, 6:07 pm
Please log in for more thread options
> Bonsoir,
>
> I did succeed to have my pop-ups, thanks to Ben... but something is not
> clear for me: there is a kind of transparency in the pop-up and if the
> text of the pop-up is "over" another text we can see the text "below"
> and this is a difficulty for reading. See:
>
> http://www.math-info.univ-paris5.fr/~patte/bhaskara/genealogie.html
I don't know why that is happening. I think it's a Firefox bug-- it does
have a few problems with stacking order sometimes, although I've not
seen this one before.
Firefox is stacking the popup behind the .traduction element. You can
see the black background of the popup through .traduction's transparent
background. .traduction's opaque black text is appearing on top of the
white text of the popup and obscuring it. It's also appearing on top of
.traduction's background but is camouflaged since they're both black.
A bit of an optical illusion. It comes out looking like the popup has a
black background and transparent text. But that's not what's going on.
It's clearer what's happening if you give .traduction background-color:
blue, and change the background and foreground colours of the popups so
that neither of them are white (white is confusing since the body
background is white).
Anyway it is stacking, not opacity, that's the problem. The popups
should be stacked on top of the .traduction elements since the popups
are absolutely positioned and the .traduction elements are not. This
isn't happening in Firefox.
If you get rid of opacity but add
z-index: 1;
to the styles for .transliteration, to bring it to the front explicitly,
the problem is solved in Firefox, and should work in other browsers too.
| 
XML Sitemap