Is it correct to combine active and hover pseudo selector like a:active:hover.?

I've seen this somewhere, but I can't find more info telling me if it's correct:

.selector a:active:hover { color: #777; }
.selector a:hover:active { color: #777; }

I don't remember which one of the 2 it was.

But either way, Firefox doesn't seem to like it and does nothing.

Was it another example of a tutorial showing bad practice.??

Answers


Both are fine (and identically equivalent). I've just tested in Firefox 4.0b6/Mac and it works exactly as I would expect. In the below example, the link turns red when I point at it, and then green while I hold the mouse button down.

<!DOCTYPE HTML>
<title>Test</title>
<style>
a:hover { color: red; }
a:active { color: yellow; }
a:hover:active { color: green; }
</style>
<h1><a href="test">gggg</a></h1>

It is unusual to want a link to be styled differently when activated with the mouse than with the keyboard though.

I suspect you may be making a classic mistake. :active means "While being activated (e.g. while the mouse button is depressed over it)" and not "When the href attribute's value resolves to the URI of the current page".

There is no pseudo-class that means "When the href attribute's value resolves to the URI of the current page", for that the classic pattern is to add a "current" or "selected" class to the anchor on the server before sending the HTML to the client.


Need Your Help

Is subsonic dead?

subsonic data-access-layer

The company I work for pretty much uses a subsonic DAL for everything we do.

Amazon aws hints

mongodb amazon-web-services tomcat7 elastic-beanstalk amazon-elasticache

I have to setup a server environment for a web application. I have to use aws, and so far it looks good for that purpose.

About UNIX Resources Network

Original, collect and organize Developers related documents, information and materials, contains jQuery, Html, CSS, MySQL, .NET, ASP.NET, SQL, objective-c, iPhone, Ruby on Rails, C, SQL Server, Ruby, Arrays, Regex, ASP.NET MVC, WPF, XML, Ajax, DataBase, and so on.