hover - aber richtig?

  • 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?? :roll:

    Danke im Voraus

    SAlsero

  • Hallo Sejuma,

    danke für die schnelle Antwort - aber damit hatte ich auch schon experimentiert - leider ohne ERfolg.
    weglassen wie bei sidebar führt zu keiner sichtbaren Änderung bei mir ( weiß auf weiß) - und der andere Weg ändern der beiden Farben bei a:hover im menu (z.B. in #FEFAF3 und #FFFFFF) bringt als Ergebnis, dass beim Überfahren nichts mehr passiert....

    Siehst Du, oder jemand einen anderen Fehler diesbezüglich? :confused:

    LIeben Dank

    Salsero

    PS: HAbe jetzt mal für alle Fälle die unterschiedlichen FArben beibehalten - die Zeile ist jetzt also:

    #menu a:hover {background-color:#FEFAF3; color:#FFFFFF; }

  • Und? Funktioniert das jetzt mit unterschiedlichen Farbcodes?
    Falls ja, dann muss es doch daran gelegen haben.
    Falls nein: Poste bitte mal einen Link zur Problemseite, damit man alles im Zusammenhang sieht.

    Hallo sejuma,

    nein, das hatte es auch nicht getan ( ich habe es nur schon mal verarbeitet, weil es ja eigentlich logisch wäre - hat aber keinen Effekt)

    Ich habe die 3 Hautdateien mal auf den SMartdrive gestellt ( ich möchte mir jetzt nicht noch Chaos mit der bereits laufenden alten Homepage bereiten, OK?

    LInk

    https://smartdrive.web.de/guest?path=Pag…e=de&viewType=0

    Heissen Dank im Voraus

    Salsero

    P.S: Die ganze Seite ist gerade im "Aufbau" - andere Dinge muss ich sicher auch noch überarbeiten.:)