CSS attachment is causing green links instead of purple

liunx

Guest
I recently added

a:visited {
color: #4B0082;
text-decoration: none;
font-size:12px;
font-family:times new roman, arial, helvetica, sans-serif;
{

to my style sheet for visited links. I wanted it to be purple. At first the purple color code turned my links into green. I also tried the color code for violet, indigo, and other related colors of purple.

My source of color codes is from <!-- m --><a class="postlink" href="http://www.htmlhelp.com">http://www.htmlhelp.com</a><!-- m -->. See design elements. The last link for design elements is RGB color codes.

I want my unvisited to be blue and visited to be purple.

Please help me to fix this. Another message board suggested that the problem was with the semicolon. I added it in, but it made no difference.There were three errors that can cause the problems you were describing. There were some other minor errors. I've attached the fixed CSS file and placed comments where I made corrections and what was corrected.

If you want, you can always validate your CSS at <!-- m --><a class="postlink" href="http://jigsaw.w3.org/css-validator/">http://jigsaw.w3.org/css-validator/</a><!-- m -->

It's helped me on a number of occasions.Hello.

Make sure that if you have a style sheet attached, that you haven't added the style tag at the beginning of your document. This can also cause problems.

Take Care x

P.S. Your sytle tags should look like this:

<style>
A:link {text-decoration:none; color:#000000; }
A:visited {text-decoration:none; color:#666699; }
A:hover {text-decoration:none; color:#669999}
</style>

These definately work!<style type="text/css">
blah blah blah
</style>And people always forget to enclose their style statements in an HTML comment tag. :)

<style type="text/css" media="screen|handheld|print|...">
<!--
/* Style declarations */
-->
</style>

Properly importing CSS files:

<link rel="stylesheet" type="text/css" media="..." href=http://www.webdeveloper.com/forum/archive/index.php/"path/to/stylesheet.css">

NOTE: By adding the media="" attribute, NS 4.0 - 4.8 does not recognize the link tag, at least with the playing around that I've done. Leave out the media attribute and NS imports the stylesheet.

<style type="text/css" media="...">
<!--
@import "path/to/stylesheet.css";
/* Other style statements */
-->
</style>

This method only works for 5.0+ browsers, basically those released 2000 and after. The only exception is Internet Explorer 4.5 for the Mac. It does import CSS files with this method, and gets the CSS box model wrong.Below is my style sheet (in full) with the style tags. Is there any correction that needs to be made. I recently added the style </style> tags. What corrections need to be made?

<style>
body {
background: #ffffff;
color: #000000
font-size:12px;
font-family:times new roman,arial,helvetica,sans-serif;
}

a:active {
color:#0000FF;
text-decoration: none;
font-size:12px;
font-family:times new roman, arial, helvetica, sans-serif;
}

a:link {
color: #0000FF;
text-decoration: none
font-size:12px;
font-family:times new roman, arial, helvetica, sans-serif;
}

a:visited {
color:#4B0082;
text-decoration: none
font-size:12px;
font-family:times new roman, arial, helvetica, sans-serif;
}

a:hover {
color: #0000FF;
text-decoration: none;
font-size:12px;
font-family:times new roman, arial, helvetica, sans-serif;
}

h1 {
font-family: times new roman,arial,helvetica,sans-serif;
font-size: 18px;
font-weight: bold;
color: #000000;
margin-bottom: 0;
padding-bottom: 0;
}

h2 {
font-family: times new roman,arial,helvetica,sans-serif;
font-size: 18px;
font-weight: bold;
color: #000000;
margin-bottom: 0;
padding-bottom: 0;
}

.banner{
font-family: times new roman,arial,helvetica,sans-serif;
color: #003300;
font-size: medium;
font-weight:bold;
}

.section {
color: #800000;
font-family: times new roman,arial,helvetica,sans-serif;
font-size: medium;
font-weight: bold;
}
</style>Well, you could have saved yourself some typing:

<style type="text/css">
<!--
body {
background : #ffffff;
color : #000000;
font-size : 12px;
font-family : "times new roman", arial, helvetica, sans-serif;
}
a:link {
color : blue;
}
a:visited {
color : purple;
}
a:hover
color : red;
}
a:active {
color: red;
}
a {
text-decoration : none;
font-size : 12px;
font-family : "times new roman", arial, helvetica, sans-serif;
}
h1 , h2 {
font-family : "times new roman", arial, helvetica, sans-serif;
font-size : 18px;
font-weight : bold;
color : #000000;
margin-bottom : 0;
padding-bottom : 0;
}
.banner {
font-family : "times new roman", arial, helvetica, sans-serif;
color : #003300;
font-size : medium;
font-weight : bold;
}
.section {
color : #800000;
font-family : "times new roman", arial, helvetica, sans-serif;
font-size : medium;
font-weight : bold;
}
-->
</style>
 
Back
Top