thanks for your help

urbanrays — Sun, 28 Dec 2008 15:42:40 +0000

thanks for your help kazimmerman i have finally sorted it, it was me being an arse and not paying attention, as usual

hi I have created 2 classes

urbanrays — Sun, 28 Dec 2008 14:43:20 +0000

hi
I have created 2 classes 1 called urbansmall the other urbanlarge this is the script in the head

this is urbansmall css

.urbansmall {
font-family: Arial, Helvetica, sans-serif;
font-size: small;
color: #FFFFFF;
text-decoration: none;
}
a.urbansmall:link {
font-family: "Century Gothic";
font-size: small;
color: #FFFFFF;
text-decoration: none;
}
a.urbansmall:visited {
font-family: "Century Gothic";
font-size: small;
color: #FFFFFF;
text-decoration: none;
}
a.urbansmall:hover {
font-family: "Century Gothic";
font-size: small;
color: #CEA974;
text-decoration: none;
}
a.urbansmall:active {
font-family: "Century Gothic";
font-size: small;
color: #FFFFFF;
text-decoration: none;
}

this is urbanlarge

.urbanlarge {
font-family: "Century Gothic";
font-size: large;
font-weight: bold;
color: #FFFFFF;
text-decoration: none;
}
a.urbanlarge:link {
font-family: "Century Gothic";
font-size: x-large;
font-weight: bold;
color: #FFFFFF;
text-decoration: none;
}
a.urbanlarge:visited {
font-family: "Century Gothic";
font-size: large;
font-weight: bold;
color: #FFFFFF;
text-decoration: none;
}
a.urbanlarge:hover {
font-family: "Century Gothic";
font-size: large;
font-weight: bold;
color: #EBC284;
text-decoration: none;
}
a.urbanlarge:active {
font-family: "Century Gothic";
font-size: large;
font-weight: bold;
color: #FFFFFF;
text-decoration: none;
}

before i just had 2 css with no classnames in front of them
and when i place
a.urbansmall:hover etc
a.urbanlarge:hover etc
the 2 texts have now changed but as soon as i write the link in the urbanlarge goes blue with an underline

It's hard to see what you're

kazimmerman — Sun, 28 Dec 2008 13:58:04 +0000

It's hard to see what you're doing wrong without a link or at least the CSS and HTML files you are working with, but, if I understand your problem, you would simply need to create different CSS classes for your different types of links.

a.linkStyleOne {
  font-family: ...
  font-size: ...
  ...
}
a.linkStyleTwo {
  font-family: ...
  font-size: ...
}

And you would probably want to style the :hover element for each as well. Additionally, you can avoid classes altogether by identifying the links directly by their container (is there an official name for that kind of construct?), like this:

div1 a {
  font-family: ...
  font-size: ...
}
div2 ul li a {
  font-family: ...
  font-size: ...
}

Again, if this doesn't help please post a link to the page you're having trouble with or supply the CSS and HTML behind it so we can work a little more closely with it.