Anchor colors

Anchor colors

am 02.08.2007 19:09:04 von tshad

My links/anchors in my site are a turquoise color.

a {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size:10px;
}
a:link {
color:#3EA2BC;
}
a:active {
color:#3EA2BC;
}

I have some tags I want to be a different color so I set up a class -
bodybold.

It seems the way I do it with my menu list doesn't work for my other links
For my menu Links I do it this way:

..nav-menu li a
{
height: 2em;
line-height: 2em;
color: #666666; /* Color of the Link - need to change it for a:visited as
well */
text-align: center;
margin: 0;
padding: 0;
font-weight: bold;
}
..nav-menu li a:visited
{
color: #666666; /* Color of visited link - should be the same as the "a"
tag */
}

The class name, then the list, then the link. This is then applied as so:



This doesn't work for my normal links:

My is:



I tried this first:

..bodybold
{
font-family:Geneva, Arial, Helvetica, sans-serif;
font-style:normal;
font-size:11px;
font-weight:Bold;
text-decoration:none;
color:#666666
}

That didn't work.

I then realized that I needed to specifically set the
specifically as I
do with my list menus, so I now have:

..bodybold a
{
font-family:Geneva, Arial, Helvetica, sans-serif;
font-style:normal;
font-size:11px;
font-weight:Bold;
text-decoration:none;
color:#666666
}

..bodybold a:link
{
font-family:Geneva, Arial, Helvetica, sans-serif;
font-style:normal;
font-size:11px;
font-weight:Bold;
text-decoration:none;
color:#666666
}
..bodybold a:active
{
font-family:Geneva, Arial, Helvetica, sans-serif;
font-style:normal;
font-size:11px;
font-weight:Bold;
text-decoration:none;
color:#666666
}
..bodybold a:visited
{
font-family:Geneva, Arial, Helvetica, sans-serif;
font-style:normal;
font-size:11px;
font-weight:Bold;
text-decoration:none;
color:#666666
}
This still didn't work work. But then I did this which did work.

a.bodybold:link
{
font-family:Geneva, Arial, Helvetica, sans-serif;
font-style:normal;
font-size:11px;
font-weight:Bold;
text-decoration:none;
color:#666666
}
a.bodybold:active
{
font-family:Geneva, Arial, Helvetica, sans-serif;
font-style:normal;
font-size:11px;
font-weight:Bold;
text-decoration:none;
color:#666666
}
a.bodybold:visited
{
font-family:Geneva, Arial, Helvetica, sans-serif;
font-style:normal;
font-size:11px;
font-weight:Bold;
text-decoration:none;
color:#666666
}

Why didn't the previous ones work?

Thanks,

Tom.

Re: Anchor colors

am 02.08.2007 20:19:38 von John Hosking

tshad wrote:
> My links/anchors in my site are a turquoise color.

By which I guess you mean #3EA2BC. A URL would be useful.

>
> a {
> font-family: Verdana, Arial, Helvetica, sans-serif;
> font-size:10px;
> }
> a:link {
> color:#3EA2BC;
> }
> a:active {
> color:#3EA2BC;
> }
>
> I have some tags

By which I guess you mean links, or elements, rather than tags.

> I want to be a different color so I set up a class -
> bodybold.

I get itchy when I see a class name suggesting its presumed formatting
rather than the semantic importance of the classed items. Here, I wonder
which link elements you want to be non-#3EA2BC, and *why*. Are they auto
models? Member names? Monitor brands? Planets? Species of primates? Name
the class "planet" and then you can style (and re-style) as your heart
desires. With bodybold you have to watch out constantly that you don't
change from using font-weight: bold anymore.

>
> It seems the way I do it with my menu list doesn't work for my other links
> For my menu Links I do it this way:
>
> .nav-menu li a
> {
> height: 2em;
> line-height: 2em;
> color: #666666; /* Color of the Link - need to change it for a:visited as
> well */
> text-align: center;
> margin: 0;
> padding: 0;
> font-weight: bold;
> }
> .nav-menu li a:visited
> {
> color: #666666; /* Color of visited link - should be the same as the "a"
> tag */
> }
>
> The class name, then the list, then the link. This is then applied as so:
>
>

Re: Anchor colors

am 03.08.2007 00:43:03 von tshad

I am not sure I understand your explanation on the differences between:

..bodybold a:link

and

a.bodybold:link

and the reason the first one works for my links in my lists but not for the
links by themselves.

I am looking at your suggestions for information on it now.

Thanks,

Tom

"John Hosking" wrote in message
news:46b22034$1_6@news.bluewin.ch...
> tshad wrote:
>> My links/anchors in my site are a turquoise color.
>
> By which I guess you mean #3EA2BC. A URL would be useful.
>
>>
>> a {
>> font-family: Verdana, Arial, Helvetica, sans-serif;
>> font-size:10px;
>> }
>> a:link {
>> color:#3EA2BC;
>> }
>> a:active {
>> color:#3EA2BC;
>> }
>>
>> I have some tags
>
> By which I guess you mean links, or elements, rather than tags.
>
>> I want to be a different color so I set up a class -
>> bodybold.
>
> I get itchy when I see a class name suggesting its presumed formatting
> rather than the semantic importance of the classed items. Here, I wonder
> which link elements you want to be non-#3EA2BC, and *why*. Are they auto
> models? Member names? Monitor brands? Planets? Species of primates? Name
> the class "planet" and then you can style (and re-style) as your heart
> desires. With bodybold you have to watch out constantly that you don't
> change from using font-weight: bold anymore.
>
>>
>> It seems the way I do it with my menu list doesn't work for my other
>> links For my menu Links I do it this way:
>>
>> .nav-menu li a
>> {
>> height: 2em;
>> line-height: 2em;
>> color: #666666; /* Color of the Link - need to change it for a:visited
>> as well */
>> text-align: center;
>> margin: 0;
>> padding: 0;
>> font-weight: bold;
>> }
>> .nav-menu li a:visited
>> {
>> color: #666666; /* Color of visited link - should be the same as the
>> "a" tag */
>> }
>>
>> The class name, then the list, then the link. This is then applied as
>> so:
>>
>>

Re: Anchor colors

am 03.08.2007 04:08:27 von cfajohnson

On 2007-08-02, tshad wrote:
> I am not sure I understand your explanation on the differences between:
>
> .bodybold a:link
>
> and
>
> a.bodybold:link

The first one is an anchor inside an element with class="bodybold";
the second is an anchor with class="bodybold".

> and the reason the first one works for my links in my lists but not for the
> links by themselves.

URL?

--
Chris F.A. Johnson
============================================================ =======
Author:
Shell Scripting Recipes: A Problem-Solution Approach (2005, Apress)

Re: Anchor colors

am 05.08.2007 23:31:14 von jkorpela

Scripsit tshad:

> My links/anchors in my site are a turquoise color.

Bad idea, especially since you use the same color for unvisited and visited
links.

> font-size:10px;

Bad idea.

The symptoms strongly suggest that you should stop authoring web pages, take
a crash course on the basics, and start afresh. Don't try to fix the pages
you have already written; it's much faster and more productive to redesign
them from scratch.

I don't expect you to like this idea, but it's really the best advice.

--
Jukka K. Korpela ("Yucca")
http://www.cs.tut.fi/~jkorpela/

Re: Anchor colors

am 08.08.2007 01:24:12 von tshad

Unfortunately, I don't have a public site to use - just an intranet.

In the following, can I put the selectors together (the following works - I
just want to see if I can combine them)?

..nav-menu-side li a
{
height: 2em;
line-height: 2em;
color: #666666; /* Color of the Link - need to change it for a:visited as
well */
text-align: center;
margin: 0;
padding: 0;
text-decoration:none;
font-size:9px;
}
..nav-menu-side li a:link
{
color: #666666; /* Color of visited link - should be the same as the "a"
tag */
}
..nav-menu-side li a:visited
{
color: #666666; /* Color of visited link - should be the same as the "a"
tag */
}
..nav-menu-side li a:hover
{
color: #666666; /* Color of visited link - should be the same as the "a"
tag */
}
..nav-menu-side li a:active
{
color: #666666; /* Color of visited link - should be the same as the "a"
tag */
}

I tried

..nav-menu-side li a:link a:visited a:hover a:active
{
color: #666666; /* Color of visited link - should be the same as the "a"
tag */
}

And

..nav-menu-side li a:link a:visited a:hover a:active
{
color: #666666; /* Color of visited link - should be the same as the "a"
tag */
}

neither of these worked.

I am using them for my menu links that I want to be the same color and not
change when visted as these are just for navigation and they will be using
them constantly on all my pages.



Thanks,

Tom

"Chris F.A. Johnson" wrote in message
news:r9fao4-qoe.ln1@xword.teksavvy.com...
> On 2007-08-02, tshad wrote:
>> I am not sure I understand your explanation on the differences between:
>>
>> .bodybold a:link
>>
>> and
>>
>> a.bodybold:link
>
> The first one is an anchor inside an element with class="bodybold";
> the second is an anchor with class="bodybold".
>
>> and the reason the first one works for my links in my lists but not for
>> the
>> links by themselves.
>
> URL?
>
> --
> Chris F.A. Johnson
> ============================================================ =======
> Author:
> Shell Scripting Recipes: A Problem-Solution Approach (2005, Apress)

Re: Anchor colors

am 08.08.2007 04:01:06 von John Hosking

tshad wrote:
> Unfortunately, I don't have a public site to use - just an intranet.

Please don't top-post.

Please get access to a public site and post your code there and a URL
here. Nobody wants to see all this code out of context. There are free
servers where you can put up a page for free, if your ISP doesn't
provide one.

>
> In the following, can I put the selectors together (the following works - I
> just want to see if I can combine them)?

Yes, did you not read my post up-thread? You responded to it.
In message <46b22034$1_6@news.bluewin.ch> I said

> Also BTW: since these three rule sets are identical, you can combine them to
>
> a.bodybold:link, a.bodybold:visited, a.bodybold:active

Note the commas delimiting three selectors.

Back to your last post:
>
> I tried
>
> .nav-menu-side li a:link a:visited a:hover a:active

The delimiter is a comma. Between each comma you need the exact (full)
selector you want added to the list for the shared ruleset. So:

..nav-menu-side li a:link,
..nav-menu-side li a:visited,
..nav-menu-side li a:hover,
..nav-menu-side li a:active { color: #666666; }

> And
>
> .nav-menu-side li a:link a:visited a:hover a:active

How is this second attempt different from the first? I don't see it.

> neither of these worked.

Two (identical) stabs in the dark. Get a reference and use it.

BTW, if you have identical rules for :link, :hover, and :active, you can
probably just specify a:link, a:visited and leave out the others, as
they are affected by the a:link selector.

--
John
Pondering the value of the UIP: http://blinkynet.net/comp/uip5.html

Re: Anchor colors

am 08.08.2007 17:26:00 von tshad

"John Hosking" wrote in message
news:46b923d6$1_5@news.bluewin.ch...
> tshad wrote:
>> Unfortunately, I don't have a public site to use - just an intranet.
>
> Please don't top-post.
>
> Please get access to a public site and post your code there and a URL
> here. Nobody wants to see all this code out of context. There are free
> servers where you can put up a page for free, if your ISP doesn't provide
> one.
>

Where would I find one of those?

That would make it easier.

>>
>> In the following, can I put the selectors together (the following works -
>> I just want to see if I can combine them)?
>
> Yes, did you not read my post up-thread? You responded to it.
> In message <46b22034$1_6@news.bluewin.ch> I said
>
>> Also BTW: since these three rule sets are identical, you can combine them
>> to
>>
>> a.bodybold:link, a.bodybold:visited, a.bodybold:active
>
> Note the commas delimiting three selectors.
>
> Back to your last post:
>>
>> I tried
>>
>> .nav-menu-side li a:link a:visited a:hover a:active
>
> The delimiter is a comma. Between each comma you need the exact (full)
> selector you want added to the list for the shared ruleset. So:
>
> .nav-menu-side li a:link,
> .nav-menu-side li a:visited,
> .nav-menu-side li a:hover,
> .nav-menu-side li a:active { color: #666666; }
>
>> And
>>
>> .nav-menu-side li a:link a:visited a:hover a:active
>
> How is this second attempt different from the first? I don't see it.

My mistake. I actually meant to have commas between them but left it out.
And, as you pointed out, that wouldn't work as I needed the whole selector.

>
>> neither of these worked.
>
> Two (identical) stabs in the dark. Get a reference and use it.

I actually have a couple of references, but from them references I couldn't
figure out the differences between:

..bodybold a:link

and

a.bodybold:link

At least not directly. For example, I didn't see in my references (may have
missed it) that a:Link affects the other classes.
>
> BTW, if you have identical rules for :link, :hover, and :active, you can
> probably just specify a:link, a:visited and leave out the others, as they
> are affected by the a:link selector.

Are you saying that a:hover and a:active is affected by a:link or a:hover is
affected by a:link and a:active is affected by visited? Just wanted to make
sure.

Also, since we are using the pseudo selectors, is

a{
}

not really useful? I can't figure out why I would use the "a" tag by
itself.

>

So I assume that the following:

..bodybold a:link
{
font-family:Geneva, Arial, Helvetica, sans-serif;
font-style:normal;
font-size:11px;
font-weight:Bold;
text-decoration:none;
color:#666666
}
..bodybold a:visited
{
font-family:Geneva, Arial, Helvetica, sans-serif;
font-style:normal;
font-size:11px;
font-weight:Bold;
text-decoration:none;
color:#666666
}
..bodybold a:hover
{
font-family:Geneva, Arial, Helvetica, sans-serif;
font-style:normal;
font-size:11px;
font-weight:Bold;
text-decoration:none;
color:#666666
}
..bodybold a:active
{
font-family:Geneva, Arial, Helvetica, sans-serif;
font-style:normal;
font-size:11px;
font-weight:Bold;
text-decoration:none;
color:#666666
}

Can be changed to:

..bodybold a:active, .bodybold a:visited, .bodybold a:hover, .bodybold
a:active
{
font-family:Geneva, Arial, Helvetica, sans-serif;
font-style:normal;
font-size:11px;
font-weight:Bold;
text-decoration:none;
color:#666666
}

or

..bodybold a:active, .bodybold a:visited
{
font-family:Geneva, Arial, Helvetica, sans-serif;
font-style:normal;
font-size:11px;
font-weight:Bold;
text-decoration:none;
color:#666666
}

The same with this:

a.bodybold:link
{
font-family:Geneva, Arial, Helvetica, sans-serif;
font-style:normal;
font-size:11px;
font-weight:Bold;
text-decoration:none;
color:#666666
}
a.bodybold:visited
{
font-family:Geneva, Arial, Helvetica, sans-serif;
font-style:normal;
font-size:11px;
font-weight:Bold;
text-decoration:none;
color:#666666
}
a.bodybold:hover
{
font-family:Geneva, Arial, Helvetica, sans-serif;
font-style:normal;
font-size:11px;
font-weight:Bold;
text-decoration:none;
color:#666666
}
a.bodybold:active
{
font-family:Geneva, Arial, Helvetica, sans-serif;
font-style:normal;
font-size:11px;
font-weight:Bold;
text-decoration:none;
color:#666666
}

can be changed to:

a.bodybold:link, a.bodybold:visited, a.bodybold:hover, a.bodybold:active
{
font-family:Geneva, Arial, Helvetica, sans-serif;
font-style:normal;
font-size:11px;
font-weight:Bold;
text-decoration:none;
color:#666666
}

or

a.bodybold:link, a.bodybold:visited
{
font-family:Geneva, Arial, Helvetica, sans-serif;
font-style:normal;
font-size:11px;
font-weight:Bold;
text-decoration:none;
color:#666666
}

Thanks,

Tom
> --
> John
> Pondering the value of the UIP: http://blinkynet.net/comp/uip5.html

Re: Anchor colors

am 08.08.2007 17:45:57 von Michael Fesser

..oO(tshad)

>"John Hosking" wrote
>
>> BTW, if you have identical rules for :link, :hover, and :active, you can
>> probably just specify a:link, a:visited and leave out the others, as they
>> are affected by the a:link selector.
>
>Are you saying that a:hover and a:active is affected by a:link or a:hover is
>affected by a:link and a:active is affected by visited? Just wanted to make
>sure.

One of the pseudo-classes :link and :visited always applies. The other
three pseudo-classes (:hover, :active, :focus) might apply additionally
and even at the same time.

>Also, since we are using the pseudo selectors, is
>
>a{
>}
>
>not really useful? I can't figure out why I would use the "a" tag by
>itself.

For example to declare some general properties for all links, regardless
of their current state.

>So I assume that the following:
>[...]
>
>Can be changed to:
>
>.bodybold a:active, .bodybold a:visited, .bodybold a:hover, .bodybold
>a:active
>[...]

..bodybold a {
font-weight: bold;
text-decoration: none;
color: #666
}

You don't have to declare the font family, size etc. over and over
again.

>The same with this:
>[...]
>
>can be changed to:
>
>a.bodybold:link, a.bodybold:visited, a.bodybold:hover, a.bodybold:active
>[...]

a.bodybold {
font-weight: bold;
text-decoration: none;
color: #666
}

Same thing.

Micha

Re: Anchor colors

am 08.08.2007 20:34:38 von lws4art

tshad wrote:
> "John Hosking" wrote in message
> news:46b923d6$1_5@news.bluewin.ch...
>> tshad wrote:
>>> Unfortunately, I don't have a public site to use - just an intranet.
>> Please don't top-post.
>>
>> Please get access to a public site and post your code there and a URL
>> here. Nobody wants to see all this code out of context. There are free
>> servers where you can put up a page for free, if your ISP doesn't provide
>> one.
>>
>
> Where would I find one of those?
>

http://www.justfuckinggoogleit.com/search.pl?query=free+web+ hosting



--
Take care,

Jonathan
-------------------
LITTLE WORKS STUDIO
http://www.LittleWorksStudio.com

Re: Anchor colors

am 09.08.2007 01:35:18 von John Hosking

tshad wrote:
> "John Hosking" wrote in message news:46b923d6$1_5@news.bluewin.ch...
>>
>> Please get access to a public site and post your code there and a URL
>> here. Nobody wants to see all this code out of context. There are free
>> servers where you can put up a page for free, if your ISP doesn't provide
>> one.
>
> Where would I find one of those?

GIYF: search for "free hosting" or "free web server" or something. I
really hate Yahoo's GeoCities, but if all else fails (getting _good_
hosting), you could go there as a last resort.

>
> I actually have a couple of references, but from them references I couldn't
> figure out the differences between:
>
> .bodybold a:link
>
> and
>
> a.bodybold:link

Just CSS notation. The thing following the leading dot is a class name.
The thing peceding the dot, if present, is the element with that class.
A sequence of "things" separated by spaces show descendents, where each
thing is a descendent of the things to its left. A colon starts a
pseudo-selector. (And commas separate selectors in a list which use the
same rules, but you know that now.)

Selectutorial has some fine tutorials on CSS. Here's their page on
grouping selectors:
http://css.maxdesign.com.au/selectutorial/rules_group_sel.ht m

>
> At least not directly. For example, I didn't see in my references (may have
> missed it) that a:Link affects the other classes.
>> BTW, if you have identical rules for :link, :hover, and :active, you can
>> probably just specify a:link, a:visited and leave out the others, as they
>> are affected by the a:link selector.
>
> Are you saying that a:hover and a:active is affected by a:link or a:hover is
> affected by a:link and a:active is affected by visited? Just wanted to make
> sure.

Here's some more to read (and refer back to later). If you read this
(and understand it) you ought to have no more problems in this area.
http://www.satzansatz.de/cssd/pseudocss.html is a page which talks
primarily about bugs in IE regarding pseudo-selectors (so it's both more
than we're discussing here and also restricted to just a couple of
browser versions), but it contains a good explanation about the :link,
:visited, et. al. mechanics. I suggest that you just skip to
http://www.satzansatz.de/cssd/pseudocss.html#link-pseudo-cla sses and
read from there.

And from the horse's mouth (also linked to from above):
http://www.w3.org/TR/CSS21/selector.html#link-pseudo-classes
http://www.w3.org/TR/CSS21/selector.html#dynamic-pseudo-clas ses

And for dessert, here are a couple of fun facts from
http://www.quirksmode.org/css/hover.html ;-)

..test:hover doesn't work in Mozilla/Firefox in CSS Quirks Mode.

:hover on elements other than links doesn't work in Explorer 7 in CSS
Quirks Mode.

>
> Also, since we are using the pseudo selectors, is a { }
> not really useful? I can't figure out why I would use the "a" tag by
> itself.

Not all
elements are links. You don't see the non-link kind very
often anymore, but they exist.

>
> So I assume that the following:
>
> .bodybold a:link
> {
[snippage of repeated identical rules]
> }
> .bodybold a:visited
> {
[snippage]
> }
> .bodybold a:hover
> {
[snippage]
> }
> .bodybold a:active
> {
[snippage]
> }
>
> Can be changed to:
>
> .bodybold a:active, .bodybold a:visited, .bodybold a:hover, .bodybold
> a:active

If you correct the first a:active in what I presume is a typo here to

.bodybold a:link, .bodybold a:visited, .bodybold a:hover, .bodybold
a:active

> {
[snippage]
> }

....then yes, but

>
> or
>
> .bodybold a:active, .bodybold a:visited
> {
[snippage]
> }

No. Don't know how you jumped here. Ah! unless you have the same typo.
If you mean .bodybold a:link, .bodybold a:visited, then yes.


> The same with this:
>
> a.bodybold:link
> {
> }
> a.bodybold:visited
> {
> }
> a.bodybold:hover
> {
> }
> a.bodybold:active
> {
> }
>
> can be changed to:
>
> a.bodybold:link, a.bodybold:visited, a.bodybold:hover, a.bodybold:active
> {
> }
>
> or
>
> a.bodybold:link, a.bodybold:visited
> {
> }
Well, yes, but do note that these are two entirely different examples
you've given. "a.bodybold:link" is different from ".bodybold a:link".


--
John
Pondering the value of the UIP: http://blinkynet.net/comp/uip5.html

Re: Anchor colors

am 09.08.2007 11:46:26 von Andy Dingley

On 8 Aug, 00:24, "tshad" wrote:
> Unfortunately, I don't have a public site to use - just an intranet.

Then either find help from just those people who can see your
intranet, or else find some simple public hosting where you can post
static HTML/CSS (i.e. the _results_ of you ASP code) so that a much
larger group of people can see it.

One of these groups is likely to be more helpful than the other. One
of these hosting choices is accessible to that group. The rest is your
choice.

Re: Anchor colors

am 09.08.2007 22:59:38 von tshad

"John Hosking" wrote in message
news:46ba532a$1_2@news.bluewin.ch...
> tshad wrote:
>> "John Hosking" wrote in message news:46b923d6$1_5@news.bluewin.ch...
>>>
>>> Please get access to a public site and post your code there and a URL
>>> here. Nobody wants to see all this code out of context. There are free
>>> servers where you can put up a page for free, if your ISP doesn't
>>> provide one.
>>
>> Where would I find one of those?
>
> GIYF: search for "free hosting" or "free web server" or something. I
> really hate Yahoo's GeoCities, but if all else fails (getting _good_
> hosting), you could go there as a last resort.
>
>>
>> I actually have a couple of references, but from them references I
>> couldn't figure out the differences between:
>>
>> .bodybold a:link
>>
>> and
>>
>> a.bodybold:link
>
> Just CSS notation. The thing following the leading dot is a class name.
> The thing peceding the dot, if present, is the element with that class. A
> sequence of "things" separated by spaces show descendents, where each
> thing is a descendent of the things to its left. A colon starts a
> pseudo-selector. (And commas separate selectors in a list which use the
> same rules, but you know that now.)
>
> Selectutorial has some fine tutorials on CSS. Here's their page on
> grouping selectors:
> http://css.maxdesign.com.au/selectutorial/rules_group_sel.ht m
>
>>
>> At least not directly. For example, I didn't see in my references (may
>> have missed it) that a:Link affects the other classes.
>>> BTW, if you have identical rules for :link, :hover, and :active, you can
>>> probably just specify a:link, a:visited and leave out the others, as
>>> they are affected by the a:link selector.
>>
>> Are you saying that a:hover and a:active is affected by a:link or a:hover
>> is affected by a:link and a:active is affected by visited? Just wanted
>> to make sure.
>
> Here's some more to read (and refer back to later). If you read this (and
> understand it) you ought to have no more problems in this area.
> http://www.satzansatz.de/cssd/pseudocss.html is a page which talks
> primarily about bugs in IE regarding pseudo-selectors (so it's both more
> than we're discussing here and also restricted to just a couple of browser
> versions), but it contains a good explanation about the :link, :visited,
> et. al. mechanics. I suggest that you just skip to
> http://www.satzansatz.de/cssd/pseudocss.html#link-pseudo-cla sses and read
> from there.
>
> And from the horse's mouth (also linked to from above):
> http://www.w3.org/TR/CSS21/selector.html#link-pseudo-classes
> http://www.w3.org/TR/CSS21/selector.html#dynamic-pseudo-clas ses
>
> And for dessert, here are a couple of fun facts from
> http://www.quirksmode.org/css/hover.html ;-)
>

I will be looking at these pretty closely.

I have been looking at: http://www.w3schools.com/css/css_pseudo_classes.asp
with is pretty basic but helps as a tickler to remember the format.

> .test:hover doesn't work in Mozilla/Firefox in CSS Quirks Mode.
>
> :hover on elements other than links doesn't work in Explorer 7 in CSS
> Quirks Mode.
>
>>
>> Also, since we are using the pseudo selectors, is a { }
>> not really useful? I can't figure out why I would use the "a" tag by
>> itself.
>
> Not all
elements are links. You don't see the non-link kind very often
> anymore, but they exist.
>
>>
>> So I assume that the following:
>>
>> .bodybold a:link
>> {
> [snippage of repeated identical rules]
>> }
>> .bodybold a:visited
>> {
> [snippage]
>> }
>> .bodybold a:hover
>> {
> [snippage]
>> }
>> .bodybold a:active
>> {
> [snippage]
>> }
>>
>> Can be changed to:
>>
>> .bodybold a:active, .bodybold a:visited, .bodybold a:hover, .bodybold
>> a:active
>
> If you correct the first a:active in what I presume is a typo here to

Yes, it was.

I meant it as you typed it.
>
> .bodybold a:link, .bodybold a:visited, .bodybold a:hover, .bodybold
> a:active
>
>> {
> [snippage]
>> }
>
> ...then yes, but
>
>>
>> or
>>
>> .bodybold a:active, .bodybold a:visited
>> {
> [snippage]
>> }
>
> No. Don't know how you jumped here. Ah! unless you have the same typo. If
> you mean .bodybold a:link, .bodybold a:visited, then yes.
>
>
>> The same with this:
>>
>> a.bodybold:link
>> {
>> }
>> a.bodybold:visited
>> {
>> }
>> a.bodybold:hover
>> {
>> }
>> a.bodybold:active
>> {
>> }
>>
>> can be changed to:
>>
>> a.bodybold:link, a.bodybold:visited, a.bodybold:hover, a.bodybold:active
>> {
>> }
>>
>> or
>>
>> a.bodybold:link, a.bodybold:visited
>> {
>> }
> Well, yes, but do note that these are two entirely different examples
> you've given. "a.bodybold:link" is different from ".bodybold a:link".

They are different examples - but just wanted to make sure there wasn't some
gotcha between the different types.

Thanks - this helps a lot,

Tom
>
>
> --
> John
> Pondering the value of the UIP: http://blinkynet.net/comp/uip5.html

Re: Anchor colors

am 17.08.2007 23:46:13 von tshad

I tried some of the suggestions from here and the articles mentioned and
still am confused. I tried applying this to a datagrid in asp.net which
renders to something like (with the CSS):


id="_ctl0__ctl1_DataGrid1"
style="border-width:0px;width:635px;border-collapse:collapse ;">





No matter what I do - the links in the header are
showing as lime green. I am trying to get them to change to red.

The links in my site should be Lime Green (a:link and a:visited). I have
the headerstyles' CssClass set to gridHeaderStyle - but it doesn't seem to
be working for the links in the header.

I though the ".gridHeaderStyle a:link" or a.gridHeaderStyle:link would
override the a:link but it doesn't seem to be doing this.

Am I missing something here?

Thanks,

Tom
"tshad" wrote in message
news:_eLui.56800$5j1.13545@newssvr21.news.prodigy.net...
>
> "John Hosking" wrote in message
> news:46ba532a$1_2@news.bluewin.ch...
>> tshad wrote:
>>> "John Hosking" wrote in message news:46b923d6$1_5@news.bluewin.ch...
>>>>
>>>> Please get access to a public site and post your code there and a URL
>>>> here. Nobody wants to see all this code out of context. There are free
>>>> servers where you can put up a page for free, if your ISP doesn't
>>>> provide one.
>>>
>>> Where would I find one of those?
>>
>> GIYF: search for "free hosting" or "free web server" or something. I
>> really hate Yahoo's GeoCities, but if all else fails (getting _good_
>> hosting), you could go there as a last resort.
>>
>>>
>>> I actually have a couple of references, but from them references I
>>> couldn't figure out the differences between:
>>>
>>> .bodybold a:link
>>>
>>> and
>>>
>>> a.bodybold:link
>>
>> Just CSS notation. The thing following the leading dot is a class name.
>> The thing peceding the dot, if present, is the element with that class. A
>> sequence of "things" separated by spaces show descendents, where each
>> thing is a descendent of the things to its left. A colon starts a
>> pseudo-selector. (And commas separate selectors in a list which use the
>> same rules, but you know that now.)
>>
>> Selectutorial has some fine tutorials on CSS. Here's their page on
>> grouping selectors:
>> http://css.maxdesign.com.au/selectutorial/rules_group_sel.ht m
>>
>>>
>>> At least not directly. For example, I didn't see in my references (may
>>> have missed it) that a:Link affects the other classes.
>>>> BTW, if you have identical rules for :link, :hover, and :active, you
>>>> can probably just specify a:link, a:visited and leave out the others,
>>>> as they are affected by the a:link selector.
>>>
>>> Are you saying that a:hover and a:active is affected by a:link or
>>> a:hover is affected by a:link and a:active is affected by visited? Just
>>> wanted to make sure.
>>
>> Here's some more to read (and refer back to later). If you read this (and
>> understand it) you ought to have no more problems in this area.
>> http://www.satzansatz.de/cssd/pseudocss.html is a page which talks
>> primarily about bugs in IE regarding pseudo-selectors (so it's both more
>> than we're discussing here and also restricted to just a couple of
>> browser versions), but it contains a good explanation about the :link,
>> :visited, et. al. mechanics. I suggest that you just skip to
>> http://www.satzansatz.de/cssd/pseudocss.html#link-pseudo-cla sses and read
>> from there.
>>
>> And from the horse's mouth (also linked to from above):
>> http://www.w3.org/TR/CSS21/selector.html#link-pseudo-classes
>> http://www.w3.org/TR/CSS21/selector.html#dynamic-pseudo-clas ses
>>
>> And for dessert, here are a couple of fun facts from
>> http://www.quirksmode.org/css/hover.html ;-)
>>
>
> I will be looking at these pretty closely.
>
> I have been looking at:
> http://www.w3schools.com/css/css_pseudo_classes.asp with is pretty basic
> but helps as a tickler to remember the format.
>
>> .test:hover doesn't work in Mozilla/Firefox in CSS Quirks Mode.
>>
>> :hover on elements other than links doesn't work in Explorer 7 in CSS
>> Quirks Mode.
>>
>>>
>>> Also, since we are using the pseudo selectors, is a { }
>>> not really useful? I can't figure out why I would use the "a" tag by
>>> itself.
>>
>> Not all
elements are links. You don't see the non-link kind very
>> often anymore, but they exist.
>>
>>>
>>> So I assume that the following:
>>>
>>> .bodybold a:link
>>> {
>> [snippage of repeated identical rules]
>>> }
>>> .bodybold a:visited
>>> {
>> [snippage]
>>> }
>>> .bodybold a:hover
>>> {
>> [snippage]
>>> }
>>> .bodybold a:active
>>> {
>> [snippage]
>>> }
>>>
>>> Can be changed to:
>>>
>>> .bodybold a:active, .bodybold a:visited, .bodybold a:hover, .bodybold
>>> a:active
>>
>> If you correct the first a:active in what I presume is a typo here to
>
> Yes, it was.
>
> I meant it as you typed it.
>>
>> .bodybold a:link, .bodybold a:visited, .bodybold a:hover, .bodybold
>> a:active
>>
>>> {
>> [snippage]
>>> }
>>
>> ...then yes, but
>>
>>>
>>> or
>>>
>>> .bodybold a:active, .bodybold a:visited
>>> {
>> [snippage]
>>> }
>>
>> No. Don't know how you jumped here. Ah! unless you have the same typo. If
>> you mean .bodybold a:link, .bodybold a:visited, then yes.
>>
>>
>>> The same with this:
>>>
>>> a.bodybold:link
>>> {
>>> }
>>> a.bodybold:visited
>>> {
>>> }
>>> a.bodybold:hover
>>> {
>>> }
>>> a.bodybold:active
>>> {
>>> }
>>>
>>> can be changed to:
>>>
>>> a.bodybold:link, a.bodybold:visited, a.bodybold:hover, a.bodybold:active
>>> {
>>> }
>>>
>>> or
>>>
>>> a.bodybold:link, a.bodybold:visited
>>> {
>>> }
>> Well, yes, but do note that these are two entirely different examples
>> you've given. "a.bodybold:link" is different from ".bodybold a:link".
>
> They are different examples - but just wanted to make sure there wasn't
> some gotcha between the different types.
>
> Thanks - this helps a lot,
>
> Tom
>>
>>
>> --
>> John
>> Pondering the value of the UIP: http://blinkynet.net/comp/uip5.html
>
>

Re: Anchor colors

am 18.08.2007 00:14:11 von tshad

"tshad" wrote in message
news:2Hoxi.6247$4w7.3252@newssvr22.news.prodigy.net...
>I tried some of the suggestions from here and the articles mentioned and
>still am confused. I tried applying this to a datagrid in asp.net which
>renders to something like (with the CSS):
>
>
>

> id="_ctl0__ctl1_DataGrid1"
> style="border-width:0px;width:635px;border-collapse:collapse ;">
>
>
>
>

>

I also tried to change the Link to:



But that didn't work either.

Tom
> No matter what I do - the links in the header are
> showing as lime green. I am trying to get them to change to red.
>
> The links in my site should be Lime Green (a:link and a:visited). I have
> the headerstyles' CssClass set to gridHeaderStyle - but it doesn't seem to
> be working for the links in the header.
>
> I though the ".gridHeaderStyle a:link" or a.gridHeaderStyle:link would
> override the a:link but it doesn't seem to be doing this.
>
> Am I missing something here?
>
> Thanks,
>
> Tom
> "tshad" wrote in message
> news:_eLui.56800$5j1.13545@newssvr21.news.prodigy.net...
>>
>> "John Hosking" wrote in message
>> news:46ba532a$1_2@news.bluewin.ch...
>>> tshad wrote:
>>>> "John Hosking" wrote in message news:46b923d6$1_5@news.bluewin.ch...
>>>>>
>>>>> Please get access to a public site and post your code there and a URL
>>>>> here. Nobody wants to see all this code out of context. There are free
>>>>> servers where you can put up a page for free, if your ISP doesn't
>>>>> provide one.
>>>>
>>>> Where would I find one of those?
>>>
>>> GIYF: search for "free hosting" or "free web server" or something. I
>>> really hate Yahoo's GeoCities, but if all else fails (getting _good_
>>> hosting), you could go there as a last resort.
>>>
>>>>
>>>> I actually have a couple of references, but from them references I
>>>> couldn't figure out the differences between:
>>>>
>>>> .bodybold a:link
>>>>
>>>> and
>>>>
>>>> a.bodybold:link
>>>
>>> Just CSS notation. The thing following the leading dot is a class name.
>>> The thing peceding the dot, if present, is the element with that class.
>>> A sequence of "things" separated by spaces show descendents, where each
>>> thing is a descendent of the things to its left. A colon starts a
>>> pseudo-selector. (And commas separate selectors in a list which use the
>>> same rules, but you know that now.)
>>>
>>> Selectutorial has some fine tutorials on CSS. Here's their page on
>>> grouping selectors:
>>> http://css.maxdesign.com.au/selectutorial/rules_group_sel.ht m
>>>
>>>>
>>>> At least not directly. For example, I didn't see in my references (may
>>>> have missed it) that a:Link affects the other classes.
>>>>> BTW, if you have identical rules for :link, :hover, and :active, you
>>>>> can probably just specify a:link, a:visited and leave out the others,
>>>>> as they are affected by the a:link selector.
>>>>
>>>> Are you saying that a:hover and a:active is affected by a:link or
>>>> a:hover is affected by a:link and a:active is affected by visited?
>>>> Just wanted to make sure.
>>>
>>> Here's some more to read (and refer back to later). If you read this
>>> (and understand it) you ought to have no more problems in this area.
>>> http://www.satzansatz.de/cssd/pseudocss.html is a page which talks
>>> primarily about bugs in IE regarding pseudo-selectors (so it's both more
>>> than we're discussing here and also restricted to just a couple of
>>> browser versions), but it contains a good explanation about the :link,
>>> :visited, et. al. mechanics. I suggest that you just skip to
>>> http://www.satzansatz.de/cssd/pseudocss.html#link-pseudo-cla sses and
>>> read from there.
>>>
>>> And from the horse's mouth (also linked to from above):
>>> http://www.w3.org/TR/CSS21/selector.html#link-pseudo-classes
>>> http://www.w3.org/TR/CSS21/selector.html#dynamic-pseudo-clas ses
>>>
>>> And for dessert, here are a couple of fun facts from
>>> http://www.quirksmode.org/css/hover.html ;-)
>>>
>>
>> I will be looking at these pretty closely.
>>
>> I have been looking at:
>> http://www.w3schools.com/css/css_pseudo_classes.asp with is pretty basic
>> but helps as a tickler to remember the format.
>>
>>> .test:hover doesn't work in Mozilla/Firefox in CSS Quirks Mode.
>>>
>>> :hover on elements other than links doesn't work in Explorer 7 in CSS
>>> Quirks Mode.
>>>
>>>>
>>>> Also, since we are using the pseudo selectors, is a { }
>>>> not really useful? I can't figure out why I would use the "a" tag by
>>>> itself.
>>>
>>> Not all
elements are links. You don't see the non-link kind very
>>> often anymore, but they exist.
>>>
>>>>
>>>> So I assume that the following:
>>>>
>>>> .bodybold a:link
>>>> {
>>> [snippage of repeated identical rules]
>>>> }
>>>> .bodybold a:visited
>>>> {
>>> [snippage]
>>>> }
>>>> .bodybold a:hover
>>>> {
>>> [snippage]
>>>> }
>>>> .bodybold a:active
>>>> {
>>> [snippage]
>>>> }
>>>>
>>>> Can be changed to:
>>>>
>>>> .bodybold a:active, .bodybold a:visited, .bodybold a:hover, .bodybold
>>>> a:active
>>>
>>> If you correct the first a:active in what I presume is a typo here to
>>
>> Yes, it was.
>>
>> I meant it as you typed it.
>>>
>>> .bodybold a:link, .bodybold a:visited, .bodybold a:hover, .bodybold
>>> a:active
>>>
>>>> {
>>> [snippage]
>>>> }
>>>
>>> ...then yes, but
>>>
>>>>
>>>> or
>>>>
>>>> .bodybold a:active, .bodybold a:visited
>>>> {
>>> [snippage]
>>>> }
>>>
>>> No. Don't know how you jumped here. Ah! unless you have the same typo.
>>> If you mean .bodybold a:link, .bodybold a:visited, then yes.
>>>
>>>
>>>> The same with this:
>>>>
>>>> a.bodybold:link
>>>> {
>>>> }
>>>> a.bodybold:visited
>>>> {
>>>> }
>>>> a.bodybold:hover
>>>> {
>>>> }
>>>> a.bodybold:active
>>>> {
>>>> }
>>>>
>>>> can be changed to:
>>>>
>>>> a.bodybold:link, a.bodybold:visited, a.bodybold:hover,
>>>> a.bodybold:active
>>>> {
>>>> }
>>>>
>>>> or
>>>>
>>>> a.bodybold:link, a.bodybold:visited
>>>> {
>>>> }
>>> Well, yes, but do note that these are two entirely different examples
>>> you've given. "a.bodybold:link" is different from ".bodybold a:link".
>>
>> They are different examples - but just wanted to make sure there wasn't
>> some gotcha between the different types.
>>
>> Thanks - this helps a lot,
>>
>> Tom
>>>
>>>
>>> --
>>> John
>>> Pondering the value of the UIP: http://blinkynet.net/comp/uip5.html
>>
>>
>
>

Re: Anchor colors

am 18.08.2007 00:15:57 von John Hosking

tshad wrote:

Please don't top-post. Again.

> I tried some of the suggestions from here and the articles mentioned and
> still am confused. I tried applying this to a datagrid in asp.net which
> renders to something like (with the CSS):

If you had a URL as we've discussed you wouldn't need to post this code,
and we could all see the results, in all the browsers we have available,
with all the debugging tools we have.


> .gridHeaderStyle a:link, .gridHeaderStyle a:visited {
> color:#red;
> }

It's either color:red; or color:#FF0000; or color:#F00;

> a.gridHeaderStyle:link, a.gridHeaderStyle:visited {
> color:#red;
> }

You don't have any elements which match this selector, as previously
discussed.


>
>
>

>
> No matter what I do - the links in the header are
> showing as lime green. I am trying to get them to change to red.
>
> The links in my site should be Lime Green (a:link and a:visited).

No, not exactly. Lime green is #00FF00.

> I have
> the headerstyles' CssClass set to gridHeaderStyle - but it doesn't seem to
> be working for the links in the header.

This comment is inexact enough to make me think you're doing something
(else) bizarre; when you say, "I have the headerstyles' CssClass set to
gridHeaderStyle," it makes me think you're using a class name as a
property for another class, which won't work. Of course without the URL
we can't see the entire code, and without the entire code we don't know
what's supposed to be a header.
>
> I though the ".gridHeaderStyle a:link" or a.gridHeaderStyle:link would
> override the a:link but it doesn't seem to be doing this.
>
> Am I missing something here?

It could be that you need to add the td to the selector, as in
..gridHeaderStyle td a:link, .gridHeaderStyle td a:visited { color:red; }
but I think you probably just need to get the value right. If you had
provided a URL I could have tested it and told you for sure.

Tom, you really, really need to get into a position (and train yourself
to be in the habit) to validate your code. If you keep bashing your head
against invalid code, you're only going to end up with a bloody
forehead. Study the tutorials provided earlier to get your selectors
right, but don't even bother hoping for good results (or asking here)
before you know you have valid code.

And then if you still need to ask here, bring a URL. We'll be glad to
help you then.

HTH. GL.

--
John

Re: Anchor colors

am 18.08.2007 00:21:45 von John Hosking

tshad wrote:
[Previous text from tschad himself, including semi-relevant info, snipped]

>
> I also tried to change the Link to:
>
>


Please stop just guessing. Please validate your code.

>
> But that didn't work either.
>
> Tom

[rest of text from week-old and irrelevant posts snipped]
Please trim your posts.

--
John
Pondering the value of the UIP: http://blinkynet.net/comp/uip5.html

Re: Anchor colors

am 18.08.2007 00:24:23 von tshad

"John Hosking" wrote in message
news:46c61e0b$1_7@news.bluewin.ch...
> tshad wrote:
>
> Please don't top-post. Again.
>
>> I tried some of the suggestions from here and the articles mentioned and
>> still am confused. I tried applying this to a datagrid in asp.net which
>> renders to something like (with the CSS):
>
> If you had a URL as we've discussed you wouldn't need to post this code,
> and we could all see the results, in all the browsers we have available,
> with all the debugging tools we have.
>
>
>> .gridHeaderStyle a:link, .gridHeaderStyle a:visited {
>> color:#red;
>> }
>
> It's either color:red; or color:#FF0000; or color:#F00;

You're right. I just figured it out before I saw the post. The color was
originally something like #E6E6E6 but I just double clicked it and changed
it to red. Didn't notice it hadn't grabbed the #.

>
>> a.gridHeaderStyle:link, a.gridHeaderStyle:visited {
>> color:#red;
>> }
>
> You don't have any elements which match this selector, as previously
> discussed.
>
>
>>
>>
>>
>
>>
>> No matter what I do - the links in the header are
>> showing as lime green. I am trying to get them to change to red.
>>
>> The links in my site should be Lime Green (a:link and a:visited).
>
> No, not exactly. Lime green is #00FF00.

Probably right.
>
>> I have
>> the headerstyles' CssClass set to gridHeaderStyle - but it doesn't seem
>> to
>> be working for the links in the header.
>
> This comment is inexact enough to make me think you're doing something
> (else) bizarre; when you say, "I have the headerstyles' CssClass set to
> gridHeaderStyle," it makes me think you're using a class name as a
> property for another class, which won't work. Of course without the URL we
> can't see the entire code, and without the entire code we don't know
> what's supposed to be a header.
>>
>> I though the ".gridHeaderStyle a:link" or a.gridHeaderStyle:link would
>> override the a:link but it doesn't seem to be doing this.
>>
>> Am I missing something here?
>
> It could be that you need to add the td to the selector, as in
> .gridHeaderStyle td a:link, .gridHeaderStyle td a:visited { color:red; }
> but I think you probably just need to get the value right. If you had
> provided a URL I could have tested it and told you for sure.
>
> Tom, you really, really need to get into a position (and train yourself to
> be in the habit) to validate your code. If you keep bashing your head
> against invalid code, you're only going to end up with a bloody forehead.
> Study the tutorials provided earlier to get your selectors right, but
> don't even bother hoping for good results (or asking here) before you know
> you have valid code.
>
Actually, have been looking at the tutorials but I still get confused as to
when to use:

..gridHeaderStyle a:link, .gridHeaderStyle a:visited {
color:#red;
}

or

a.gridHeaderStyle:link, a.gridHeaderStyle:visited {
color:#red;
}

It seems that the 1st is the correct one, in this case. This was what I was
testing and of course couldn't get past the error.

Thanks,

Tom

> And then if you still need to ask here, bring a URL. We'll be glad to help
> you then.
>
> HTH. GL.
>
> --
> John

Re: Anchor colors

am 18.08.2007 01:58:36 von lws4art

tshad wrote:
> "tshad" wrote in message



Seems we are taking wild stabs at it eh? How about looking up valid
syntax first.

http://www.w3.org/TR/CSS21/syndata.html#value-def-color


>> .gridHeaderStyle a:link, .gridHeaderStyle a:visited {
>> color:#red;
^
Of course because your rules are invalid so they are ignored...

--
Take care,

Jonathan
-------------------
LITTLE WORKS STUDIO
http://www.LittleWorksStudio.com