...

View Full Version : multiple colored links on a page - css



Jabbamonkey
10-23-2002, 08:35 PM
I'm trying to have several different colored links on a page, and I know you can do this using style sheets... I just can't figure out how.

Here's what I have....


<STYLE TYPE-type/ccs"><!--

Body {margin-left:0; margin-top:0; margin-right:0; margin-bottom:0; background-color: #666699}

.sidenav1 {font-size: 12px; font-family: arial, helvetica, verdana; font-weight: bold; color: #9999CC}
.sidenav1:link {color: #9999CC; text-decoration:underline}
.sidenav1:hover {color: #FCDF69; text-decoration:underline}
.sidenav1:visited {color: #9999CC; text-decoration:underline}
.sidenav1:active {color: #9999CC; text-decoration:underline}

.bodycopy {font-size: 12px; font-family: arial, helvetica, verdana; font-weight: normal; color: #000000}
.bodycopy:link {color: #000033; text-decoration:underline}
.bodycopy:hover {color: #333366; text-decoration:underline}
.bodycopy:visited {color: #000033; text-decoration:underline}
.bodycopy:active {color: #000033; text-decoration:underline}

.sidenav_small {font-size: 10px; font-family: arial, helvetica, verdana; font-weight: normal; color: #999999}

.input {color: #000000; background-color: #666699; font-size: 9px; font-family: arial, helvetica, verdana; font-weight: normal; border: 1px inset #666699; }
.input2 {color: #000000; background-color: #666699; font-size: 9px; font-family: arial, helvetica, verdana; font-weight: normal; border: 1px inset #666699; }

--></STYLE>

Can anyone tell me what I'm doing wrong? I've never been good with Style Sheets....

Jabbamonkey

BroChris
10-23-2002, 09:26 PM
The very first line got mis-typed, it should read:



<STYLE TYPE="text/ccs"><!--


Also make sure you reference each class in the appropriate tags in your html document.

Jabbamonkey
10-23-2002, 09:43 PM
I fixed that typo, but it still isn't working correctly.

I know that the css sheet is working to some degree on the page (and that the style tags are in the html), because the actual text appears the correct color (Even my form input styles are fine: class="input"). BUT, whenever a link is added, the link color is the webpage default.

I'm so confused..... Any idea what's going wrong?



Jabbamonkey

MCookie
10-23-2002, 09:54 PM
.sidenav1 {font-size: 12px; font-family: arial, helvetica, verdana; font-weight: bold; color: #9999CC}
.sidenav1 a:link {color: #9999CC; text-decoration:underline}
.sidenav1 a:visited {color: #9999CC; text-decoration:underline}
.sidenav1 a:hover {color: #FCDF69; text-decoration:underline}
.sidenav1 a:active {color: #9999CC; text-decoration:underline}

.bodycopy {font-size: 12px; font-family: arial, helvetica, verdana; font-weight: normal; color: #000000}
.bodycopy a:link {color: #000033; text-decoration:underline}
.bodycopy a:visited {color: #000033; text-decoration:underline}
.bodycopy a:hover {color: #333366; text-decoration:underline}
.bodycopy a:active {color: #000033; text-decoration:underline}

The right order is link, visited, hover, active.
Used this way, put your class names in a <div> or <td>, not in an <a> tag.

Jabbamonkey
10-23-2002, 10:03 PM
As simple as that....

Thanks alot.



Jabbamonkey



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum