pseudo class

P

Paul M

Hi
Is it easier to attach a pseudo class to a layer div rather than a table. I
want to have different hyperlink link colours on the same page.
best wishes
Paul M
 
M

MD Websunlimited

Hi Paul,

Are we speaking about CSS here? A pseudo class selector is available only on very specific element selectors. Divs and tables do
not have any.
 
P

Paul M

Hi
Thanks for replying I am not sure, but the affect I am trying to achieve is
similar to the hyperlinks on http://www.tictocdesign.com/ the hyperlinks
are different colours, grey to black on the side of the page and grey to red
elsewhere. I want to make sure that I choose the easiest method (divs or
tables) to achieve this.
Paul M

MD Websunlimited said:
Hi Paul,

Are we speaking about CSS here? A pseudo class selector is available only
Click to expand...
on very specific element selectors. Divs and tables do
 
M

Murray

You can define pseudo-classes for any page element. For example, a single
page with this in the head -

<style type="text-css">
<!--
a:link, a:visited, a:active { font-weight:bold; font-size:36px;
color:fuscia; }
a:hover { color:black; }
-->
</style>

will cause every link on the page to correspond to those styles.

If you then add this -

#foo a:hover { color:green; }

then all links will be black on hover EXCEPT those contained in something
with an ID of "foo", like -

<div id="foo"><a href="foo.html">Link this</a></div>

See what is happening here?

You are not 'attaching' anything to anything. You are simply allowing the
styles you have defined to cascade into their specific containers.
 
P

Paul M

Thanks Murray
I can't seem to get it to work.I cut and pasted the style section into the
head but it didnt change my hyperlinks.
where do I put the
#foo a:hover { color:green; } in the head or the body
 
M

Murray

Show me your code, please.

You would add that to the stylesheet you pasted into the head.
 
P

Paul M

Thanks Murray here is the code on the test page

<html>

<head>
<meta http-equiv="Content-Language" content="en-gb">
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>erterterter</title>
<style type="text-css">
<!--
a:link, a:visited, a:active { font-weight:bold; font-size:36px;
color:fuscia; }
a:hover { color:black; }
-->
</style>

</head>

<body>

<table border="0" cellpadding="0" cellspacing="0" width="100%" id="table1">
<tr>
<td id="foo"><a href="corporategiving.html">test link1</a></td>
</tr>
<tr>
<td><a href="charities.html">test link 2</a></td>
</tr>
</table>

<p>&nbsp;</p>

</body>

</html>
 
M

Murray

OMG - you did exactly what I told you to, even when it was wrong! 8(

Try this, please -

<style type="text/css">
<!--
a:link, a:visited, a:active { font-weight:bold; font-size:36px;
color:red; }
a:hover { color:black; }
#foo a:hover { color:green; }
-->
</style>

(note the replacement of the improper hyphen with the more convention and
syntactically correct slash)

I also changed the color to a REAL name! 8)
 
P

Paul M

Thanks Murray
Works a treat
Best wishes
Paul M
Murray said:
OMG - you did exactly what I told you to, even when it was wrong! 8(

Try this, please -

<style type="text/css">
<!--
a:link, a:visited, a:active { font-weight:bold; font-size:36px;
color:red; }
a:hover { color:black; }
#foo a:hover { color:green; }
-->
</style>

(note the replacement of the improper hyphen with the more convention and
syntactically correct slash)

I also changed the color to a REAL name! 8)
Click to expand...
 
P

Paul M

Hi Murray
Thinking on can I attach a style sheet ( so I can change something site
wide) and still use the extra bit you so kindly gave me like this, it works
in IE 6 can you see any problems with any other browsers.

<html>

<head>
<meta http-equiv="Content-Language" content="en-gb">
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>erterterter</title>
<link rel="stylesheet" type="text/css" href="linkcolours.css">

<style type="text/css">
<!--
#foo a:hover { color:green; }
-->
</style>


</head>
 
Top