Re: [WSG] attribute selectors to target external and internal links
On Sat, October 23, 2010 3:46 am, tee wrote: Now I feel like the simpleton who tried enter the room with a long stick holding horizontally. tee Is that horizontally, perpendicular to the entrance or horizontally, parallel to the entrance? *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org ***
Re: [WSG] attribute selectors to target external and internal links
Umm. In your particular case, 'domain-name' would be 'site.com'. I
believe Thierry meant you to use -
a[href*=site.com] {...}
Is that what you tried?
Cordially,
David
--
I thought I did, but I guess I didn't as I kept thinking absolute path
therefore it must start with http://;
It overwrites [href^=http] rule though.
I have this:
a[href*=site.com] {color: #e21;background: #555;}
Then I added this thinking this will tell the browser to give external link
with a white background, but all links are with white background.
[href^=http]{color: #e21;background: #fff;}
The http overrules the one with site.com value.
According to the specs,
[att^=val]
Represents an element with the att attribute whose value begins with the prefix
“val”.
[att$=val]
Represents an element with the att attribute whose value ends with the suffix
“val”.
[att*=val]
Represents an element with the att attribute whose value contains at least one
instance of the substring “val”.
Unless I can be certain external links will never share a same word with the
site domain name, it's not very safe to use the attributes.
tee
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***
Re: [WSG] attribute selectors to target external and internal links
Forgive me if I'm missing the point here, but if you use:
a {
color : red;
text-decoration : none;
border : none;
}
a[href*=site1] {
color: #f00;
background: #555;
}
a[href*=site2] {
color: #00f;
background: #eee;
}
a[href*=site3] {
color: #0f0;
background: #ff0;
}
It works for me. More importantly, it ignores any links containing site,
so in other words, it really does have to be the full domain for it to work.
You can see this test here:
http://www.betasite.fsnet.co.uk/gam/attribute_selectors_external.html
HTH,
Bob
- Original Message -
From: tee weblis...@gmail.com
To: wsg@webstandardsgroup.org
Sent: Friday, October 22, 2010 9:22 AM
Subject: Re: [WSG] attribute selectors to target external and internal links
[snip]
The http overrules the one with site.com value.
Unless I can be certain external links will never share a same word with the
site domain name, it's not very safe to use the attributes.
tee
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***
Re: [WSG] attribute selectors to target external and internal links
tee wrote:
I have this:
a[href*=site.com] {color: #e21;background: #555;}
Then I added this thinking this will tell the browser to give external link
with a white background, but all links are with white background.
[href^=http]{color: #e21;background: #fff;}
The http overrules the one with site.com value.
And if you put the rules in the opposite order, the site.com one will
override the http one, just the same as if you had two rules for h1 or p
in your stylesheet.
Rob
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***
Re: [WSG] attribute selectors to target external and internal links
Unless I am missing the obvious, this wouldn't work because I have no way to
know what external links client's will link to. I need a method that wouldn't
fail.
tee
On Oct 22, 2010, at 4:54 AM, designer wrote:
Forgive me if I'm missing the point here, but if you use:
a {
color : red;
text-decoration : none;
border : none;
}
a[href*=site1] {
color: #f00;
background: #555;
}
a[href*=site2] {
color: #00f;
background: #eee;
}
a[href*=site3] {
color: #0f0;
background: #ff0;
}
It works for me. More importantly, it ignores any links containing site, so
in other words, it really does have to be the full domain for it to work. You
can see this test here:
http://www.betasite.fsnet.co.uk/gam/attribute_selectors_external.html
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***
Re: [WSG] attribute selectors to target external and internal links
On Fri, Oct 22, 2010 at 3:57 PM, tee weblis...@gmail.com wrote:
Unless I am missing the obvious, this wouldn't work because I have no way to
know what external links client's will link to. I need a method that wouldn't
fail.
Unless I'm misunderstanding your question all you need to do is style
your a tags this way in this order to get the right style on the right
links:
a { style whatever the default style you want }
a[href^=http] { style whatever style you want for all external links }
a[href*=sitethatisnotanexternalsite.com] { style should be the same
styles used in the a{} style}
the above order of rules will style external and internal links
differently and won't fail and if there are additional domains that
you want styled the same as the internal links you just keep adding
a[href*=siteyouwanttoadd.com] { styling} to the bottom of the list.
Keep adding them to the bottom is the key here.
--
Jason Arnold
http://www.jasonarnold.net
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***
Re: [WSG] attribute selectors to target external and internal links
On Oct 22, 2010, at 5:46 PM, Jason Arnold wrote:
Unless I'm misunderstanding your question all you need to do is style
your a tags this way in this order to get the right style on the right
links:
Re-arrange the order that is!!!
Now I feel like the simpleton who tried enter the room with a long stick
holding horizontally.
tee
a { style whatever the default style you want }
a[href^=http] { style whatever style you want for all external links }
a[href*=sitethatisnotanexternalsite.com] { style should be the same
styles used in the a{} style}
the above order of rules will style external and internal links
differently and won't fail and if there are additional domains that
you want styled the same as the internal links you just keep adding
a[href*=siteyouwanttoadd.com] { styling} to the bottom of the list.
Keep adding them to the bottom is the key here.
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***
Re: [WSG] attribute selectors to target external and internal links
I tried but couldn't get it to work.
I tried these:
a[href=http://site.com] {color: #e21;background: #555;}
a[href=http://www.site.com] {color: #e21;background: #555;}
a[href=http://subdomain.site.com/] {color: #e21;background: #555;}
a[href^=http://subdomain.site.com] {color: #e21;background: #555;}
a[href^=http://subdomain.site.com/] {color: #e21;background: #555;}
and also tried yours
a[href*=http://subdomain.site.com] {color: #e21;background: #555;}
The only way I could get it works is this:
a[href^=http]{color: #e21;background: #555;}
tee
On Oct 20, 2010, at 5:51 PM, Thierry Koblentz wrote:
If you deal with absolute paths, you should be able to match internal links
with this:
a[href*='domain-name']
--
Regards,
Thierry
www.tjkdesign.com | www.ez-css.org | @thierrykoblentz
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***
Re: [WSG] attribute selectors to target external and internal links
On 10/21/10 2:49 PM, tee wrote:
I tried but couldn't get it to work.
I tried these:
a[href=http://site.com] {color: #e21;background: #555;}
a[href=http://www.site.com] {color: #e21;background: #555;}
a[href=http://subdomain.site.com/] {color: #e21;background: #555;}
a[href^=http://subdomain.site.com] {color: #e21;background: #555;}
a[href^=http://subdomain.site.com/] {color: #e21;background:
#555;} and also tried yours a[href*=http://subdomain.site.com]
{color: #e21;background: #555;}
The only way I could get it works is this:
a[href^=http]{color: #e21;background: #555;}
tee
On Oct 20, 2010, at 5:51 PM, Thierry Koblentz wrote:
If you deal with absolute paths, you should be able to match
internal links with this:
a[href*='domain-name']
-- Regards, Thierry
Umm. In your particular case, 'domain-name' would be 'site.com'. I
believe Thierry meant you to use -
a[href*=site.com] {...}
Is that what you tried?
Cordially,
David
--
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***
[WSG] attribute selectors to target external and internal links
This rule works a[href^=http] Problem is almost every CMS system uses absolute url for internal link, this makes it impossible to target just the external link without the content editor having to add a class to it. tee *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org ***
RE: [WSG] attribute selectors to target external and internal links
This rule works a[href^=http] Problem is almost every CMS system uses absolute url for internal link, this makes it impossible to target just the external link without the content editor having to add a class to it. If you deal with absolute paths, you should be able to match internal links with this: a[href*='domain-name'] -- Regards, Thierry www.tjkdesign.com | www.ez-css.org | @thierrykoblentz *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org ***
