css order for links?

I'm having trouble with text link CSS; I want 'em to be black text until
someone hovers over them, then change color, then go back to black; it seems
the "visited" declaration screws everything up; is there a specific order
the 4 css declarations for text links should be in to make 'em behave?

Link
Visited
Hover
Active

--
James M. Shook
http://www.jshook.com

Thank you!

"James Shook" <jshook (AT) dont_mail (DOT) com> wrote

Link
Visited
Hover
Active

--
James M. Shook
http://www.jshook.com

link, visited, hover, and active do not have to be in any specific order. I
have a site with the following, and it behaves correctly: (see the Main, Photo
Albums, and Real Estate buttongs here:
http://www.rileyfamily.ca/mxsnowfall/default.asp)

a.btmainweb:visited {
color : #FFFFFF;
background-image: url(_images/grad1.gif);
border : none ;
border-width : 1px;
margin : 0;
text-decoration : none;
font-size : 3mm;
text-align: center;
}
a.btmainweb:link {
color : #FFFFFF;
background-image: url(_images/grad1.gif);
border : none ;
border-width : 1px;
margin : 0;
text-decoration : none;
font-size : 3mm;
text-align: center;
}
a.btmainweb:hover {
color : #FFFFFF;
background-image: url(_images/grad1.gif);
border : outset ;
border-width : 1px;
margin : 0;
text-decoration : none;
font-size : 3mm;
text-align: center;
}
a.btmainweb:active {
color : red;
background-image: url(_images/grad1.gif);
border : outset ;
border-width : 1px;
margin : 0;
text-decoration : none;
font-size : 3mm;
text-align: center;
}

Of course they do. Where do you get that idea?

When using this order (link-visited-hover-active) -

Link is how all links will display UNLESS THEY ARE VISITED, HOVERED, OR
ACTIVE. Visited is how all links will display once they are visited, UNLESS
THEY ARE HOVERED OR ACTIVE. Hover is how all links that are either
unvisited or visited will display UNLESS THEY ARE ACTIVE. Active is how all
links will display while they are being clicked.

You can change the order if you want, but doing so will alter that
traditional logic. For example,

link - hover - visited - active

will only display hover on an unvisited link.

Geddit?

Your order will never properly display the visited state. And in fact, your
code below is not optimal anyhow. This would be much better -

.btmainweb a:link, .btmainweb a:visited, .btmainweb a:hover, .btmainweb
a:active {
color : #FFFFFF;
background-image: url(_images/grad1.gif);
border : none ;
border-width : 1px;
margin : 0;
text-decoration : none;
font-size : 3mm;
text-align: center;
}

.btmainweb a:hover, .btmainweb a:active {
border : outset ;
}

Why on earth are you using mm for your font sizes? That's a print metric
that means nothing on the web. And further, be aware that borderutset
doesn't appear to be in the CSS specifications. Perhaps it is an IE only
style?

--
Murray --- ICQ 71997575
Team Macromedia Volunteer for Dreamweaver MX
(If you *MUST* email me, don't LAUGH when you do so!)
==================
news://forums.macromedia.com/macromedia.dreamweaver - THE BEST WAY TO GET
ANSWERS
==================
http://www.dreamweavermx-templates.com - Template Triage!
http://www.projectseven.com/go - DW FAQs, Tutorials & Resources
http://www.dwfaq.com - DW FAQs, Tutorials & Resources
http://www.macromedia.com/support/search/ - Macromedia (MM) Technotes
==================

"ChrisRi" <webforumsuser (AT) macromedia (DOT) com> wrote

link, visited, hover, and active do not have to be in any specific order.
I
have a site with the following, and it behaves correctly: (see the Main,
Photo
Albums, and Real Estate buttongs here:
http://www.rileyfamily.ca/mxsnowfall/default.asp)

a.btmainweb:visited {
color : #FFFFFF;
background-image: url(_images/grad1.gif);
border : none ;
border-width : 1px;
margin : 0;
text-decoration : none;
font-size : 3mm;
text-align: center;
}
a.btmainweb:link {
color : #FFFFFF;
background-image: url(_images/grad1.gif);
border : none ;
border-width : 1px;
margin : 0;
text-decoration : none;
font-size : 3mm;
text-align: center;
}
a.btmainweb:hover {
color : #FFFFFF;
background-image: url(_images/grad1.gif);
border : outset ;
border-width : 1px;
margin : 0;
text-decoration : none;
font-size : 3mm;
text-align: center;
}
a.btmainweb:active {
color : red;
background-image: url(_images/grad1.gif);
border : outset ;
border-width : 1px;
margin : 0;
text-decoration : none;
font-size : 3mm;
text-align: center;
}

link, visited, hover, and active do not have to be in any specific
order.

Yes they do. Have a read here:

http://www.meyerweb.com/eric/css/link-specificity.html

--
Regards

John Waller

.oO(ChrisRi)

link, visited, hover, and active do not have to be in any specific order.

Please read the spec before posting wrong statements. In general the
pseudo-classes have to be in a specific order, unless you know exactly
what you're doing (there are reasons for changing the order, but you
have to know the consequences).

I
have a site with the following, and it behaves correctly

Yep, because :link and :visited are mutually exclusive, but :hover and
:active are not. Using a "wrong" order might lead to unexpected results.


BTW: Your stylesheet is rather bloated, you could reduce it to something
like this:

a.btmainweb {
margin: 0;
background: url(_images/grad1.gif);
color: #FFF;
text-align: center;
text-decoration: none;
font-size: 3mm;
border: none
}

a.btmainweb:hover {border: 1px outset #RGB}
a.btmainweb:active {color: #F00}


And why do you use the unit 'mm' in the web? What is 3mm on a screen?

Micha

Originally posted by: Newsgroup User

link, visited, hover, and active do not have to be in any specific
order.

Yes they do. Have a read here:

http://www.meyerweb.com/eric/css/link-specificity.html

--
Regards

John Waller

Thanx, John - I have been corrected. My apologies. Guess I've just been
"lucky" with the order - never even thought about it before.

Regards,

Chris

In article <cd0l4t$9fb$1 (AT) forums (DOT) macromedia.com>,
"Murray *TMM*" <forums (AT) HAHAgreat-web-sights (DOT) com> wrote:

And further, be aware that borderutset doesn't appear to be in the
CSS specifications. Perhaps it is an IE only style?

No, that's valid CSS; see
<http://www.w3.org/TR/CSS21/box.html#propdef-border> and
<http://www.w3.org/TR/CSS21/box.html#value-def-border-style>. Since
neither width nor color were specified for the 'border' property in the
given example, they will both revert to their defaults. That would mean
a border width of 'medium' and a color equal to the foreground color of
the elements selected (white, in this case, given the rule before it).

--
Eric A. Meyer | http://www.meyerweb.com/eric/ | CSS and standards guy
Yes.

Are you sure?
Because it reverses the logical flow of conversation.
Why is top-posting so annoying?

Eric:

Hmm - I based my reply on an inability to find it in Cascading Style Sheets
2.0! But I stand corrected, then.

Thanks!

--
Murray --- ICQ 71997575
Team Macromedia Volunteer for Dreamweaver MX
(If you *MUST* email me, don't LAUGH when you do so!)
==================
news://forums.macromedia.com/macromedia.dreamweaver - THE BEST WAY TO GET
ANSWERS
==================
http://www.dreamweavermx-templates.com - Template Triage!
http://www.projectseven.com/go - DW FAQs, Tutorials & Resources
http://www.dwfaq.com - DW FAQs, Tutorials & Resources
http://www.macromedia.com/support/search/ - Macromedia (MM) Technotes
==================

"Eric A. Meyer" <eric (AT) meyerweb (DOT) com> wrote

In article <cd0l4t$9fb$1 (AT) forums (DOT) macromedia.com>,
"Murray *TMM*" <forums (AT) HAHAgreat-web-sights (DOT) com> wrote:

And further, be aware that borderutset doesn't appear to be in the
CSS specifications. Perhaps it is an IE only style?

No, that's valid CSS; see
http://www.w3.org/TR/CSS21/box.html#propdef-border> and
http://www.w3.org/TR/CSS21/box.html#value-def-border-style>. Since
neither width nor color were specified for the 'border' property in the
given example, they will both revert to their defaults. That would mean
a border width of 'medium' and a color equal to the foreground color of
the elements selected (white, in this case, given the rule before it).

--
Eric A. Meyer | http://www.meyerweb.com/eric/ | CSS and standards guy
Yes.
Are you sure?
Because it reverses the logical flow of conversation.
Why is top-posting so annoying?