Everything looks fine in IE but when viewed in Mozilla/Netscape then the hyperlink color is badly wrong (virtually illegible!) and borders to tables are not being shown. The code is pretty simple as below. Anyone know if my syntax is slightly out or if something else is wrong?
<STYLE TYPE='text/css'>
<!-- TextRollover-1 -->
a:link {
color: #ffffff;
text-decoration: none;
}
a:visited {
color: #ffffff;
text-decoration: none;
}
a:hover {
color: #80b3FF;
text-decoration: none;
}
a:active {
color: #80b3FF;
text-decoration: none;
}
</STYLE>It would be helpful to see your whole document and to know which versions of Netscape are giving you trouble. But you might start by removing the HTML style comments from the CSS which uses C style comments. And make certain that your HTML and your CSS both pass the validator with no errors.
<!-- m --><a class="postlink" href="http://validator.w3.org/I">http://validator.w3.org/I</a><!-- m --> tried posting to the validator but got a critical error right at the start because no doctype was included ... can you tell this isn't my specialized subject!
I tried the validator with just the code I posted and got the following ERROR :-
Line: 7
Parse error - Unrecognized : <STYLE TYPE='text/css'> <!-- TextRollover-1 --> a:link { color: #ffffff; text-decoration: none; }
and the following WARNINGS :-
Line : 9 Level : 1 You have no background-color with your color : a:visited
Line : 13 Level : 1 You have no background-color with your color : a:hover
Line : 17 Level : 1 You have no background-color with your color : a:active
The page I was checking was :-
<!-- m --><a class="postlink" href="http://www.successionwizard.com/succession_planning_prices.htmPrepend">http://www.successionwizard.com/success ... htmPrepend</a><!-- m --> the following to your page:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
And the validator is flagging the fact that you are using illegal comments. CSS cannot contain HTML style comments. You must use the C style.You must use the C styleDo note, however, that C allows two slashes to indicate a comment to the end of the line; CSS does not.The actual CSS part you posted above looks fine. The C comments they were speaking of are as follows, but only inside a style sheet or between the STYLE tags:
/* comment goes here */
When you put a style sheet directly on an HTML page, start and end it like below:
<style type="text/css">
<!--
/* comment inside style sheet goes here */
a:link { ... }
.
.
.
-->
</style>
Also, the order that you write the link styles does make a difference. I've had the best luck by specifying the link styles in the order below:
a:link { ... }
a:active { ... }
a:visited { ... }
a:hover { ... }
Netscape 4.x does not recognize the :hover style for the anchor tag. NS 6.x and newer does, as does IE 4.0 and newer for PC and Mac.
BTW, the warnings in the syntax validator are not errors. Just suggestions. I almost always ignore the warnings you got with the background colors. Most browsers are smart enough to figure out the background color by themselves if no bg color is specified.Actually, you should specify them in this order ( <!-- m --><a class="postlink" href="http://www.w3.org/TR/REC-CSS2/selector.html#dynamic-pseudo-classes">http://www.w3.org/TR/REC-CSS2/selector. ... do-classes</a><!-- m --> ):
A:link { ... }
A:visited { ... }
A:hover { ... }
A:active { ... }
<STYLE TYPE='text/css'>
<!-- TextRollover-1 -->
a:link {
color: #ffffff;
text-decoration: none;
}
a:visited {
color: #ffffff;
text-decoration: none;
}
a:hover {
color: #80b3FF;
text-decoration: none;
}
a:active {
color: #80b3FF;
text-decoration: none;
}
</STYLE>It would be helpful to see your whole document and to know which versions of Netscape are giving you trouble. But you might start by removing the HTML style comments from the CSS which uses C style comments. And make certain that your HTML and your CSS both pass the validator with no errors.
<!-- m --><a class="postlink" href="http://validator.w3.org/I">http://validator.w3.org/I</a><!-- m --> tried posting to the validator but got a critical error right at the start because no doctype was included ... can you tell this isn't my specialized subject!
I tried the validator with just the code I posted and got the following ERROR :-
Line: 7
Parse error - Unrecognized : <STYLE TYPE='text/css'> <!-- TextRollover-1 --> a:link { color: #ffffff; text-decoration: none; }
and the following WARNINGS :-
Line : 9 Level : 1 You have no background-color with your color : a:visited
Line : 13 Level : 1 You have no background-color with your color : a:hover
Line : 17 Level : 1 You have no background-color with your color : a:active
The page I was checking was :-
<!-- m --><a class="postlink" href="http://www.successionwizard.com/succession_planning_prices.htmPrepend">http://www.successionwizard.com/success ... htmPrepend</a><!-- m --> the following to your page:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
And the validator is flagging the fact that you are using illegal comments. CSS cannot contain HTML style comments. You must use the C style.You must use the C styleDo note, however, that C allows two slashes to indicate a comment to the end of the line; CSS does not.The actual CSS part you posted above looks fine. The C comments they were speaking of are as follows, but only inside a style sheet or between the STYLE tags:
/* comment goes here */
When you put a style sheet directly on an HTML page, start and end it like below:
<style type="text/css">
<!--
/* comment inside style sheet goes here */
a:link { ... }
.
.
.
-->
</style>
Also, the order that you write the link styles does make a difference. I've had the best luck by specifying the link styles in the order below:
a:link { ... }
a:active { ... }
a:visited { ... }
a:hover { ... }
Netscape 4.x does not recognize the :hover style for the anchor tag. NS 6.x and newer does, as does IE 4.0 and newer for PC and Mac.
BTW, the warnings in the syntax validator are not errors. Just suggestions. I almost always ignore the warnings you got with the background colors. Most browsers are smart enough to figure out the background color by themselves if no bg color is specified.Actually, you should specify them in this order ( <!-- m --><a class="postlink" href="http://www.w3.org/TR/REC-CSS2/selector.html#dynamic-pseudo-classes">http://www.w3.org/TR/REC-CSS2/selector. ... do-classes</a><!-- m --> ):
A:link { ... }
A:visited { ... }
A:hover { ... }
A:active { ... }