active link in IE 6 and Opera 7

Giganews Newsgroups
Subject: active link in IE 6 and Opera 7
Posted by:  Peter Brause (saugruess…@x-mail.net)
Date: Sun, 9 May 2004

Hello,
my stylesheet shows different colors for visited, active and hovered links.
It works fine in IE 6, but in Opera 7 the color for the active link (red
background) is never shown. How to explain this?
Here is my code: (code optimization will be done later)

1. The HTML file
<!doctype html public "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Navigationsframe</title>
<link rel="stylesheet" type="text/css" href="css/sew1.css">
</head>
<body style="background-color:#D4D0C8">
<div align="center"><p class="menutitle">Inhalt</p>
<div class="menu01">
<hr width="170px" >
<a class="menu01" href="main.html" target="main">Startseite</a>
<hr width="170px" >
<a class="menu01" href="Archivseite.html" target="main">: : Archive</a>
<hr width="170px" >
<a class="menu01" href="Meinungsseite.html" target="main">Meinungsseite</a>
<hr width="170px" >
<a class="menu01" href="Fotoseite.html" target="main">Fotoseite</a>
<hr width="170px" >
</div><!-- class menutitle -->
</div><!-- align left -->
</body>
</html>

2. The CSS file:

a.menu01:link{
display:block;
width:170px;
text-decoration:none;
text-align:left;
font:14px arial;
padding:2px 2px 2px 0;
margin:2px 1px 1px 1px;
border:1px white;
border-top-style:none;
border-bottom-style:none;
border-left-style:none;
border-right-style:none;
color:white;
background:grey
}
a.menu01:visited{
display:block;
width:170px;
text-decoration:none;
text-align:left;
font:14px arial;
padding:2px 2px 2px 0;
margin:2px 1px 1px 1px;
border:1px white;
border-top-style:none;
border-bottom-style:none;
border-left-style:none;
border-right-style:none;
color:white;
background:blue
}
a.menu01:active {
display:block;
width:170px;
text-decoration:none;
text-align:left;
font:14px arial;
padding:2px 2px 2px 0;
margin:2px 1px 1px 1px;
border:1px white;
border-top-style:none;
border-bottom-style:none;
border-left-style:none;
border-right-style:none;
color:white;
background:red
}
a.menu01:hover {
display:block;
width:170px;
text-decoration:none;
text-align:left;
font:14px arial;
padding:2px 2px 2px 0;
margin:2px 1px 1px 1px;
border:1px white;
border-top-style:none;
border-bottom-style:none;
border-left-style:none;
border-right-style:none;
color:white;
background:green
}

thanks for helping
Peter

Replies