nicht angemeldet
Hallo,
ich tüftle jetzt schon geraume Zeit an dem Problem, meine Links per CSS an verschiedenen Stellen verschiedene Farben etc. zuzuweisen. Das klappt soweit auch gut, nur scheine ich da ein generelles Verständnisproblem zu haben. Wie ihr dem folgendn Quellcode entnehmen könnt, habe ich UL, li, a:link etc in der Klasse .nav1 bestimmt. Klappt auch. Bei der id #middle habe ich das auch getan, klappt auch. Jedoch wird der a:active Zustand aus der Klasse .nav1 übernommen. wie kann das möglich sein? Das ist auch der Fall, wenn ich alle #middle ID's einfach herausnehme.
Ich bin davon ausgegengen, dass die Linkfarben auch nur in der Klasse .nav1 zum tragen kommen.
Definiere ich jetzt in der #middle a:active { background-color: transparent}, dann geht es.
Bitte helft mir auf dioe Sprünge
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=iso-8859-1">
<title>TARA Verantstaltungen - Seminare, Vorträge, Workshops, Esoterik</title>
<link rel="shortcut icon" type="image/x-icon" href="images/button/favicon.ico">
<style type="text/css">
body {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 1em;
background-color: #fdd333;
margin: 0;
}
#nav_container_1 {
width: 125px;
margin-top: 7px;
margin-left: 23px;
background-image: url(images/images_layout/nav_cont1.jpg);
background-repeat: repeat-y;
}
.nav1 ul {
margin: 0;
padding-left: 0px;
list-style-type: none;
}
.nav1 li {
position : relative;
float : left;
width: 98%;
padding-left : 1px;
padding-right : 1px;
}
.nav1 li a{
display : block;
padding-left : 0.2em;
padding-top : 0.2em;
padding-bottom : 0.2em;
color : #990000;
text-decoration : none;
border-top : 1px solid #fae390;
border-bottom : 1px solid #d7b84b;
font-weight: normal;
font-size: 0.7em;
line-height : 1em;
}
.nav1 li a:link, a:visited {
width: 99%;
text-decoration : none;
}
.nav1 li a:hover, a:active {
background-color : #faeedc;
}
#middle a{
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 1.0em;
font-weight: bold;
text-decoration: none;
}
#middle a:link, a:visited {
color:#666600;
}
#middle a:hover, a:active {
color:#33FF00
}
</style>
</head>
<body>
<div id="nav_container_1">
<table class="nav1" border="0" cellspacing="0" cellpadding="0">
<tr>
<th>TARA</th>
</tr>
<tr>
<td><ul>
<li><a href="#" target="_self">Alle Veranstaltungen</a></li>
<li><a href="#" target="_self">Vorträge</a></li>
<li><a href="#" target="_self">Workshops</a></li>
<li><a href="#" target="_self">Seminare</a></li>
<li><a title="Tara Kurse" href="#">Kurse</a></li>
<li><a title="Tara nnuddel" href="#">knuddel</a></li>
</ul></td>
</tr>
</table>
</div>
<table id="middle" border="0" cellspacing="0" cellpadding="0">
<tr>
<td valign="top"><p>Text</p>
<ul>
<li><a href="#">LSITENELEMENT1</a></li>
<li><a href="#">nummer 2</a></li>
<li><a href="#">nummer 3</a></li>
</ul>
<p>Hallo Ronald, hier ein weiter Versuch, ging auch nicht bei einer Kollegin. </p>
<p>Hier Textänderung: <a href="#">xx Galerie </a>Uwe LInke, xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx</p>
<p> Xact Atelier xxxxxx</p>
</tr>
<tr><td><center><a href="#top" target="_self">⇑ top ⇑</a></center></td></tr>
</table>
</body>
</html>