By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
438,880 Members | 1,817 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 438,880 IT Pros & Developers. It's quick & easy.

a:hover <div> that appears outside an <h ref>

P: n/a
Hello

this page works :
http://lilou.leuwen.chez.tiscali.fr/testlilou.htm
the source :
....
a.link:hover div.test2
{display : block;
position: absolute;
z-index: 1000;
background: #000000;}
....
<a class="link" href="#">tototo
<div class="test2">
blablabla
</div>
</a>
....

a.link:hover div.test2 <-- How should i write this ligne
{display : block;
position: absolute;
z-index: 1000;
background: #000000;}

with (the div is outside a) :
<a class="link" href="#">tototo</a>
<div class="test2">
blablabla
</div>

i have read :
http://www.w3.org/TR/1998/REC-CSS2-1.../selector.html
and i have not found informations
thank you for your answer

lilou.leuwen-at-libertysurf.fr

Jul 20 '05 #1
Share this Question
Share on Google+
5 Replies


P: n/a
"Lilou" <li**********@libertysurf.fr> wrote in
news:40***********************@news.free.fr:
a.link:hover div.test2 <-- How should i write this ligne
{display : block;
position: absolute;
z-index: 1000;
background: #000000;}

with (the div is outside a) :
<a class="link" href="#">tototo</a>
<div class="test2">
blablabla
</div>


a.link:hover + div.test2

That's called an "adjacent sibling" selector. Unfortunately, Windows
versions of MSIE don't support them; IIRC they'll treat the above selector
as applying to div.test2 anywhere. So unless you're willing to write off
MSIE, you'll need to use either a "wrapper" div or an extra class name.

Jul 20 '05 #2

P: n/a
Eric Bohlman wrote:
"Lilou" <li**********@libertysurf.fr> wrote in
news:40***********************@news.free.fr:

a.link:hover div.test2 <-- How should i write this ligne
{display : block;
position: absolute;
z-index: 1000;
background: #000000;}

with (the div is outside a) :
<a class="link" href="#">tototo</a>
<div class="test2">
blablabla
</div>

a.link:hover + div.test2

That's called an "adjacent sibling" selector. Unfortunately, Windows
versions of MSIE don't support them; IIRC they'll treat the above selector
as applying to div.test2 anywhere. So unless you're willing to write off
MSIE, you'll need to use either a "wrapper" div or an extra class name.


Mozilla doesn't support it either (I think Opera isn't correct at this
as well): <http://bugzilla.mozilla.org/show_bug.cgi?id=15608>

--
Anne van Kesteren
<http://www.annevankesteren.nl/>
Jul 20 '05 #3

P: n/a
In article Anne van Kesteren wrote:
a.link:hover + div.test2

That's called an "adjacent sibling" selector. Unfortunately, Windows
versions of MSIE don't support them; IIRC they'll treat the above selector
as applying to div.test2 anywhere. So unless you're willing to write off
MSIE, you'll need to use either a "wrapper" div or an extra class name.


Mozilla doesn't support it either (I think Opera isn't correct at this
as well): <http://bugzilla.mozilla.org/show_bug.cgi?id=15608>


This combination of :hover and + works with some rare Opera versions.
7.1 or 7.2 or some beta in between, but then it was broken again. Sibling
selectors OTOH have worked since O5 and multible sibling selectors since
O6.

--
Lauri Raittila <http://www.iki.fi/lr> <http://www.iki.fi/zwak/fonts>
Saapi lähettää meiliä, jos aihe ei liity ryhmään, tai on yksityinen
tjsp., mutta älä lähetä samaa viestiä meilitse ja ryhmään.

Jul 20 '05 #4

P: n/a
Hello
thank you very much for your answers
I found a compromise : the div.test2 appears in a wrapper
http://lilou.leuwen.chez.tiscali.fr//bonic.htm : leave the mouse on the blue
words.
The results are not the same in IE6
(http://lilou.leuwen.chez.tiscali.fr/ie6.gif) and Mozilla 5.0
(http://lilou.leuwen.chez.tiscali.fr/mozilla5.gif):
with IE6 the text of the page move and the box appears, with Mozilla5 the
box appears over the rest of the text.

lilou.leuwen

"Lauri Raittila" <la***@raittila.cjb.net> a écrit dans le message de news:
MP************************@news.cis.dfn.de...
In article Anne van Kesteren wrote:
a.link:hover + div.test2

That's called an "adjacent sibling" selector. Unfortunately, Windows
versions of MSIE don't support them; IIRC they'll treat the above selector as applying to div.test2 anywhere. So unless you're willing to write off MSIE, you'll need to use either a "wrapper" div or an extra class name.


Mozilla doesn't support it either (I think Opera isn't correct at this
as well): <http://bugzilla.mozilla.org/show_bug.cgi?id=15608>


This combination of :hover and + works with some rare Opera versions.
7.1 or 7.2 or some beta in between, but then it was broken again. Sibling
selectors OTOH have worked since O5 and multible sibling selectors since
O6.

--
Lauri Raittila <http://www.iki.fi/lr> <http://www.iki.fi/zwak/fonts>
Saapi lähettää meiliä, jos aihe ei liity ryhmään, tai on yksityinen
tjsp., mutta älä lähetä samaa viestiä meilitse ja ryhmään.

Jul 20 '05 #5

P: n/a
Anne van Kesteren wrote:
Mozilla doesn't support it either (I think Opera isn't correct at this
as well): <http://bugzilla.mozilla.org/show_bug.cgi?id=15608>


Mozilla now supports it: Gecko/20040114

--
Anne van Kesteren
<http://www.annevankesteren.nl/>
Jul 20 '05 #6

This discussion thread is closed

Replies have been disabled for this discussion.