Setting the a:link, a:hover, etc. for DIV's

[jamie_g]

Hi.

I thought I've done this correct before, but...<sigh>

I have different DIV's, I have specified the different link color, text size for each.

Now I'm not sure but I can't seem to get the to work? It seems that it's taking a "default" size and color for all.

The main link color seems to be defaulting to black, thought I specified them as different colors..

Any suggestions?

CSS:

html, body {margin:0; padding:0;}
body {margin:6px 0 0 0;}

h1 {margin:0 8px 8px 18px; font:bold 16px Arial, Helvetica, sans-serif; color:#C62935;}
h2 {margin:2px 4px 2px 18px; padding:0; font:bold 12px Arial, Helvetica, sans-serif; color:#048f43;}
h3 {margin:6px 4px 4px 18px; padding:0; font:bold 14px Arial, Helvetica, sans-serif; color:#23006f;}
p {margin:4px 8px 14px 18px; font:12px Arial, Helvetica, sans-serif; color:#000; text-align:justify;}
img {border:0;}
br {clear:both;}

#container {width:701px; margin:0 auto; padding:0; background:url(../images/common/bgContainer.gif) repeat-y;}
#containerTop {width:701px; height:6px; background:url(../images/common/bgTop.gif) no-repeat left top; overflow:hidden;}
#header {width:556px; height:84px; float:left; margin:0 0 4px 0; position:relative; z-index:2;}
#content {width:556px; min-height:375px; position:relative; z-index:1;} 
#content a, a:active, a:visited {color:#000; font:Arial, Helvetica, sans-serif; text-decoration:underline;}
#content a:hover {color:#000; font:Arial, Helvetica, sans-serif; text-decoration:none;}
/** html #content {height:375px;}*/
#containerBottom {width:701px; height:49px; margin:-40px 0 0 0; background:url(../images/common/bgBottom.gif) no-repeat left top; overflow:hidden; position:relative; z-index:0;}

.top {text-align:right; margin:2px 6px; color:#048f43; font:10px Arial, Helvetica, sans-serif;}
.top a, a:active, a:visited {color:#048f43; font:Arial, Helvetica, sans-serif; text-decoration:underline;}
.top a:hover {color:#000; font:Arial, Helvetica, sans-serif; text-decoration:none;}

.source {text-align:right; margin:2px 6px; color:#666; font:10px Arial, Helvetica, sans-serif;}
.source a, a:active, a:visited {color:#666; font:Arial, Helvetica, sans-serif; text-decoration:underline;}
.source a:hover {color:#666; font:Arial, Helvetica, sans-serif; text-decoration:none;}

Specifically my "top" and "source" DIV's

"Top" Example (top of page link): http://www.jamiegerrard.com/carpentersUnion/training/

HTML:

<div class="top">[ <a href="#top" title="top of page">top of page</a> ]</div>

Source Example (source link): http://www.jamiegerrard.com/carpentersUnion/carpenters/

HTML:
<div class="source">Source: <a

href="http://www160.hrdc-drhc.gc.ca/english/LMI/occsums/Occsum.asp?which=7271" title="http://www160.hrdc-drhc.gc.ca/english/LMI/occsums/Occsum.asp?which=7271">HRSDC</a></div>

[Paul O'B]

Hi,

I haven't checked your pages but looking at the code you have errors that I can see straight away.

You have defined this:

#content a, a:active, a:visited {

What you are defining there is any anchor that is within an id of content (#content a,). You are defining the anchor itself (a) so all states of the anchor will be defined in one go.

Then after the comma you are now defining the a:active and a:visited states of all anchors (not those anchors specific to #content but all anchors.). Anything after the comma is a new style and has nothing to do with what went before.

therefore I think you meant this:

#content a, #content a:active, #content a:visited {etc..}

However the last 2 would be unnecessary as you have already defined all states in the first declaration anyway

You have repeated this error about 4 or 5 times so who knows which style is going to take effect. Correct the code and then if the problem isn't solved already we can take it from there.

Paul

[optl]

why not just choose <a class="wutever" href=""

[jamie_g]

why not just choose <a class="wutever" href=""

You can declare the link styles that way or through the DIV's, I personally find it easier to manage with the DIV's.

Thanks (again) Paul. Staring at the screen for hours (and hours) on end..lol

-jamie