Link to home
Start Free TrialLog in
Avatar of Mikkel Sandberg
Mikkel SandbergFlag for United States of America

asked on

Stacking css pseudo class selectors and pseudo elements

Hey Experts,
I'm wondering how "stackable" css class selectors and pseudo elements are. For example, I'm trying to have a hover effect on selected text. This fiddle has a simple example: http://jsfiddle.net/3nfj6Ltv/
The desired effect in this case would be the background color of the selected text to be orange and the text color to be green, but then on hover the text color changes to red. However, in my example the text stays red. Is this possible with css alone, or would I have to use Javascript/jQuery? I imagine that event handlers would make this easier.
I've never tried to do anything like this before, but anything for the client, am I right? Haha.
Thanks!
ASKER CERTIFIED SOLUTION
Avatar of Chris Stanyon
Chris Stanyon
Flag of United Kingdom of Great Britain and Northern Ireland image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
Avatar of Mikkel Sandberg

ASKER

So using Javascript may be the way to go in this instance? Or is there some other CSS trickery I can use to accomplish this?
I'm not aware of any CSS that can do what you're after.

As for JS, I'm sure it can be done. There's probably already code out there, or even a plugin for something like jQuery. You may need to build your own solution.

Not much more I can say really...
Ok. I'll give it another day to see if anyone else has input. Otherwise, I'll give you all the points and close out this question.
I meant to do this sooner, but I'm closing this out.
Thanks Chris!