Making hyperlink styles work properly in a navigation bar

When you create a navigation bar in Freeway, you may have trouble
getting all the hyperlink styles to work properly. Your styles will
probably be like this:

 #navbar a
 #navbar a:hover
 #navbar a:active

but the trouble is, Freeway sorts styles into (something like)
alphabetical order, so your styles will become:

 #navbar a
 #navbar a:active
 #navbar a:hover

and then they won’t work as intended. So what do you do?

Firstly, if you are using Freeway 5 you can set the hyperlink styles
in the Inspector if you want to, and you may find that easier. But if
you prefer to set up your own styles, the answer is to increase the
specificity of the active style, so it takes precedence over the
hover style. There is more than one way of doing this.

First method:

 #navbar a
 #navbar a:hover
 #navbar a:hover:active

This is the method I use: it works because you have to hover over a
link before you can click it.

Second method:

 #navbar a
 #navbar a:hover
 #navbar li a:active

This method only works if your navigation bar is formatted as a list
(as it normally will be).

Regards

Graham Smith
Bury St Edmunds, UK


tutorials mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

hey Graham thats a neat trick… I approached this differently in my sneaky tutorial but this is another great way to order the styles

cheers max


tutorials mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options