Valhalla Legends Forums Archive | Web Development | [HTML/CSS] Specific class for certain links

AuthorMessageTime
warz
Sorry for the repost. I didn't see the web dev forum.

Ok, I've got a few links on my page I want to use their own class. I've got it setup like so..

[code]
a.HL, a.HL:link, a.HL:visited {
font-family: Arial, sans-serif;
color: #7DCF12;
font-size: 12px;
text-decoration: none;
}

a.HL:active, a.HL:hover {
color: #B1FF4B; 
font-size: 12px; 
}

<a class="HL" href="...">link</a>
[/code]

im not very good at CSS. Anyone know why these links aren't adopting their styles?
August 17, 2005, 3:45 AM
KoRRuPT
Worked for me.....

My code
[code]
<style>
a.HL, a.HL:link, a.HL:visited {
font-family: Arial, sans-serif;
color: #7DCF12;
font-size: 12px;
text-decoration: none;
}

a.HL:active, a.HL:hover {
color: #B1FF4B; 
font-size: 12px; 
}
</style>
<a class="HL" href="...">link</a>
[/code]

The only thing I added was, <style> and </style> around your CSS.
August 17, 2005, 5:17 AM
Spht
You should use ID selectors for this type of thing.

ID selector applies to an element that have an id set.  Note that an id is unique.  The ID selector contains a '#' immediately followed by the ID value.

[code]a#HL, a:link#HL, a:visited#HL
{
    font-family: Arial, sans-serif;
    color: #7DCF12;
    font-size: 12px;
    text-decoration: none;
}

a:active#HL, a:hover#HL
{
    color: #B1FF4B; 
    font-size: 12px; 
}[/code]

[code]<a id="HL" href="...">link</a>[/code]
August 17, 2005, 3:44 PM
R.a.B.B.i.T
Another solution is this.
August 17, 2005, 9:28 PM
FrOzeN
@Rabbit, your way is good.. but better used if that link is only a One off. If you have alot of links using that style and ID would be more suited.
---

With the <style></style> shouldn't it be declared as.. <style="test/css"></style> ?

[EDIT] I mean, <style type="text/css"></style>.
August 28, 2005, 5:18 AM
venox
If this is just 1 single link on the page, you could use what spht suggests and it would still be valid source.  However, the same ID should not  be refered to twice (or more) in one page.  That's a no no.

If you are planning on using this color/style for more than one link on any given page... use the following CSS:

[code]
.HL a:link, .HL a:visited {
    font-family: Arial, sans-serif;
    color: #7DCF12;
    font-size: 12px;
    text-decoration: none;
}

.HL a:active, .HL a:hover {
    color: #B1FF4B; 
    font-size: 12px; 
}

<a class="HL" href="...">Link</a>
[/code]
August 28, 2005, 9:20 AM
JTN Designer
Personally, I just use:

[code].class1 a:link / .class2 a:link[/code]

[code]<span class="class1"><a href=link>link</a></span>[/code]
August 28, 2005, 4:18 PM
R.a.B.B.i.T
[quote author=FrOzeN link=topic=12547.msg125762#msg125762 date=1125206327]
@Rabbit, your way is good.. but better used if that link is only a One off. If you have alot of links using that style and ID would be more suited.
---

With the <style></style> shouldn't it be declared as.. <style="test/css"></style> ?

[EDIT] I mean, <style type="text/css"></style>.
[/quote]Personally I use a <link /> to include my CSS docs, but that's just me.  I prefer to superclass everything and then just either subclass or template what I need/want to change.
August 28, 2005, 9:55 PM

Search