[thelist] A:Active Working Example?

Emma Jane Hogbin emmajane at xtrinsic.com
Tue Feb 25 00:09:01 CST 2003


On Mon, Feb 24, 2003 at 02:57:28PM -0500, rudy wrote:
> >> BTW, is css case sensitive? a.something vs. A.something?
> >> I would really like to see a working example. Thanks efolk.
> >
> > Yes, it is case sensitive.
> >
> > Here's an example:
> > http://careermatters.tvo.org/highschool/other.phtml
>
> i see only lower case selectors in  careermatters.css

Yes. My point is that A.classname should NOT match a tag that is spelled
<a href=""> it should match a tag that is spelled <A href="">.

The page that I gave was an example of how one could use a "current page"
class to denote what page the user was on, which I believe is what was
requested by the original question.

<a href="">nav</a>
<a href="" class="current">nav</a> <--- current page is clickable (which I
like, other examples have removed the link, which I don't like) AND looks
different.
<a href="">nav</a>

The page above (when first written, I have no idea how it's done now)
checks what the $PHP_SELF is and if the link href matches $PHP_SELF it
adds whatever the class is for "here"ness.

> i believe a.something and A.something will both work, and both will select
> links that are coded either A or a

My understanding is that A.something and a.something are NOT actually
going to match the same thing. Remember that XHTML is case sensitive. HTML
may be more forgiving.


> emma, in that style sheet, is says
>     /* NOTES ABOUT LINKS
>     These links match too much in proper CSS because of
>     <a name="top"> anchors. In proper format these would be
>     a[href] to match links with an attribute of "href". */
>         a:link, a:visited { ... }
>         a:active { ... }
>         a:hover { ... }
> and yet the style sheet has no rule for  a

If I remember correctly that style sheet is saying that I couldn't add a rule for "a"
because it added styling to all <a name=""> AS WELL AS all <a href="">.
Make a test page with <a name> and make a CSS rule for "a" and then view
it in Mozilla, you'll see what I mean. The <a name=""> (usually a header)
will behave the same way as the links. I don't work on the site anymore
and those style sheets are well over a year old.

> then you "override" and/or add styles for links, i.e. a:link and a:visited

Technically the pseudo classes (link, visited, hover, active) shouldn't
override the "a" definition as a pseudo class doesn't have any extra
weight when dealing with conflicting rules.
http://xtrinsic.com/geek/articles/workfiles/links.html
IF the a definition comes AFTER the pseudo class definition, the pseudo
class definitions will be ignored.

This is why you're supposed to write link definitions in the order:
	a (things in common to all)
	a:link
	a:visited
	a:hover
	a:active
(aka: LoVe HAte)

More on pseudo classes:
http://www.meyerweb.com/eric/articles/webrev/200102.html
http://www.w3.org/TR/REC-CSS1#anchor-pseudo-classes

calculating conflicting rules:
http://www.w3.org/TR/REC-CSS1#cascading-order

emma

--
Emma Jane Hogbin
[[ 416 417 2868 ][ www.xtrinsic.com ]]



More information about the thelist mailing list