Hallo Gemeinde,
ich bin in CSS etwas unbedarft = ich versuche gerade ein Template mit Hilfe von Online Tutorien so zu verändern, dass es auf meine Bedürfnisse passt - mit viel TRial and Error:
Ich verzweifele jetzt etwas am Befehl hover
Ich habe auf der Seite einen Bereich sidebar - dort funktioniert der Farb- und Schriftfarbwechsel beim "mouseover"? so wie ich ihn will = Hintergrund orange - Farbe weiss wird zu Hintergrund des Links weiß und Schriftfarbe schwarz.
Exact das Gleiche hätte ich auch gerne bei dem Bereich menu -hier veraändert sich aber nur der Hintergrund beim "überfahren" - die Schrift bleibt aber auch weiss = Effekt: ich sehe nur weiß..
Konkret die Zeilen:
body {padding:50px 100px; margin:0; font-family:Arial, Helvetica, sans-serif; background-color:#D1CAB0; }
#container {background-color:#FF6600; padding:10px;}
#header {height:230px; background-color:#FF6600; color:#FFFFFF}
#logo {font-size:50px; background-color:#FF6600; height:120px; padding:50px 0px 20px 30px; margin-bottom:20px; }
#logo a {color:#FFFFFF; text-decoration:none;}
#logo h3 {font-size:30px }
#slogan {float:right; font-size:18px; padding:60px 30px 0 0; }
#menu {height:40px; background-color:#FF6600; margin-top:5px;}
#menu ul {margin:0; padding:0;}
#menu li {list-style:none; float:left; right no-repeat;}
#menu a {float:left; height:20px; padding:10px 30px; color:#FFFFFF; font-size:17px; font-weight:bold; text-decoration:none; display:block; font-family:Arial, Helvetica, sans-serif;}
#menu a:hover {background-color:#FEFAF3; color:#FEFAF3; }
#main {float:left; width:100%; margin:5px 0; background-color:#FF6600; right repeat-y; color:#1F1507; font-size:14px;}
#main a {color:#493310;}
#main a:hover {color:#000000;}
#main br {line-height:8px;}
#sidebar {width:160px; float:right; padding:0 30px 30px 30px; margin-top:10px;}
#sidebar h3 {font-size:17px; margin:20px 0 5px 0; color:#FFFFFF; font-weight:bold; }
#sidebar ul {margin:0; padding:0; border-top:1px solid #FFFFFF;}
#sidebar li {list-style:none; border-bottom:1px solid #FFFFFF;}
#sidebar li a {color:#FFFFFF; text-decoration:none; padding:3px; display:block;}
#sidebar li a:hover {background-color:#FEFAF3;}
#text {line-height:18px; margin-right:225px; padding:10px 30px 30px 30px; background-color:#ffffff;}
#text h1 {font-size:22px; font-weight:normal; margin:20px 0 10px 0;}
#text h2 {font-size:19px; font-weight:normal; margin:20px 0 10px 0;}
#text ol, #text ul {padding:0; margin:8px 0;}
#text li {margin-left:40px;}
#footer {height:40px; color:#FFFFFF; font-size:11px; background-color:#FF6600; clear:both;}
#footer a {color:#FFFFFF;}
#footer a:hover {color:#F4E7D1;}
#footer_left {float:left; padding:13px 0 0 30px;}
#footer_right {float:right; padding:13px 30px 0 0;}
Was habe ich hier übersehen - oder falsch verwurstet??
Danke im Voraus
SAlsero