Forum Moderators: not2easy
I'm wondering if there is a way to use a pseudo class to affect something outside of the affecting tag.
For example, while ul:hover > li { display:block } would work for displaying an li that was previously hidden, within a ul, what I'd like to do is be able to affect one tag via another without having that structural requirement.
So that I could do something like p.first:hover * p.second { color:red }, where hovering over the first paragraph with class 'first' would change the color of the paragraph with class 'second' to red, even though they obviously wouldn't be nested.
Any clues on how to do this, or definitive answers as to whether it's impossible with css, would be appreciated.
Thank you,
Brendan
In your example, it seems as though the <span> would have to be within the first paragraph, so could not really be affecting the second paragraph.
Theoretically for the example I gave in the beginning, I could so something like:
<p class="first">This is the first paragraph.<br /><span class="second">This is the second paragraph.</span></p>
And it would work with the descendent operator, but this is undesirable because it both fails to accurately portray the structure of the data, and breaks apart for any more complex situation.
What I'm wondering is if anyone knows whether css/css2 has the potential to let a :hover (or some other pseudoclass) over one element cause an effect on an element which occurs neither within or prior to the first. If there isn't such a function, is such a thing proposed for css3? It seems like such a simple thing, and would cure the need for some simple javascript (such as rollover image replacement--and yes, I have seen Eric's css rollover images, but I think a workaround that requires absolute positioning is not an ideal solution, and is of limited use).
Thanks for the feedback, I am not expecting that anyone knows of a way to do exactly what I want, but am curious and feel it is probably worth asking.