:focus and :active pseudo-classes

[Stephen Poley]

The issue of the focus pseudo-class came up a few weeks ago, and I
finally got around to trying it out (better late than never ...)

The recommended order given for the pseudo-classes is link, visited,
focus, hover, active. However:

- Mozilla doesn't seem to do anything with the active rule;
- IE gets things wrong as usual: it uses the active rule for focus; it
ignores the focus rule;
- Opera ignores both focus and active rules and substitutes its own
highlighting. (Perhaps a good decision as it results in consistency
across sites and makes it easier to see where one is.)

I'm not convinced that the active pseudo-class does anything useful
anyway; or if it does why it should need a different colour from focus.
I would suggest therefore that the pragmatic order for specifying the
pseudo-classes would be:

A:link
A:visited
A:active, A:focus /* in other words: IE focus, Gecko focus */
A:hover

Or, if you still have some <A NAME=...> tags lying around for the
benefit of NN4:

A:link
A:visited
A:active, A:focus
A:link:hover, A:visited:hover

Comments?

--
Stephen Poley

http://www.xs4all.nl/~sbpoley/webmatters/

[David Dorward]

Stephen Poley wrote:

- Mozilla doesn't seem to do anything with the active rule;
I've seen Mozilla respond to :active as expected (i.e. it applies the style
when the mouse button is being depressed over the element)
I'm not convinced that the active pseudo-class does anything useful
anyway;
Pretty much any (GUI interface) button you see will change state (chaning
from raised to depressed) when the mouse is clicked over it.
A:active, A:focus /* in other words: IE focus, Gecko focus */
A:hover

Then :active will never fire for browsers which implement it correctly.

--
David Dorward <http://blog.dorward.me.uk/> <http://dorward.me.uk/>
Home is where the ~/.bashrc is

[Brian]

Stephen Poley wrote:

The issue of the focus pseudo-class came up a few weeks ago, and I
finally got around to trying it out (better late than never ...)

The recommended order given for the pseudo-classes is link, visited,
focus, hover, active. However:

- Mozilla doesn't seem to do anything with the active rule;
Odd. For quite some time, I've been using a:hover and a:focus in one
rule, and a:active in a following rule, e.g.,

a:hover, a:focus { color: 600; background: #9c9;}
a:active { color: blue; background: #999;}

And I've had glitch-free results in Mozilla. Example page:

http://www.tsmchughs.com/

Works as expected in Firefox 1PR.
- IE gets things wrong as usual: it uses the active rule for focus;
it ignores the focus rule;
MSIE 6/Win does indeed screw up :focus, applying :active rules instead.
Since it isn't mission critical, and MSIE is an old browser, I'm not
worrying about it. But it is the first time that I noticed that bug.
- Opera ignores both focus and active rules and substitutes its own
highlighting. (Perhaps a good decision as it results in consistency
across sites and makes it easier to see where one is.)

I'm pretty sure :focus and :active worked fine in Opera 7.x when I
tested, but I don't have Opera on the maching I'm using, so I cannot
confirm that.

--
Brian (remove "invalid" to email me)

[Stephen Poley]

On Mon, 15 Nov 2004 18:41:17 +0000, David Dorward <do*****@yahoo.com>
wrote:

Stephen Poley wrote:

- Mozilla doesn't seem to do anything with the active rule;

I've seen Mozilla respond to :active as expected (i.e. it applies the style
when the mouse button is being depressed over the element)

Well, you live and learn. I thought the idea of 'active' was to display
briefly on clicking. Now I see it displays when you *hold* the mouse
button down. This makes it seem even less useful than I thought - why
would anyone hold the mouse-button down when clicking a link? Does that
do anything useful in any browser?

I'm not convinced that the active pseudo-class does anything useful
anyway;

Pretty much any (GUI interface) button you see will change state (chaning
from raised to depressed) when the mouse is clicked over it.

And for a typical GUI button-bar which remains on view while another
part of the display is changed, that could be useful. But when the
purpose is to replace the page entirely by a different page, I don't see
what the benefit is.

A:active, A:focus /* in other words: IE focus, Gecko focus */
A:hover

Then :active will never fire for browsers which implement it correctly.

I know. My question is - does that matter?

--
Stephen Poley

http://www.xs4all.nl/~sbpoley/webmatters/

[Lauri Raittila]

in comp.infosystems.www.authoring.stylesheets, Brian wrote:

I'm pretty sure :focus and :active worked fine in Opera 7.x when I
tested, but I don't have Opera on the maching I'm using, so I cannot
confirm that.

:focus works in Opera, but it has it's own selection thing for most
elements (not form elements for example) that overrides :focus
--
Lauri Raittila <http://www.iki.fi/lr> <http://www.iki.fi/zwak/fonts>