css styles: hover in ie und firefox sehr unterschiedlich

  • habe folgenden code, der in ie erwartungsgemäß aussieht, aber in firefox unbefriedigende ergebnisse zeigt.
    vielleicht hatte ja schon jemand von euch das problem oder sieht den fehler in meinem schreibssel.
    hier der code:
    <style type="text/css">
    html,body {
    margin:0;
    padding:0;
    color:#222;
    background:#fff;
    }
    body {
    padding:10px;
    font:76%/150% "Lucida Grande", "Lucida Sans Unicode", Lucida, Verdana, Geneva, Arial, Helvetica, sans-serif;
    }
    #nav {
    margin:0;
    padding:0;
    }
    #nav li {
    display:inline;
    padding:0;
    margin:0;
    }
    #nav a:link,
    #nav a:visited {
    color:white;
    padding:5px 5px 4px 5px;
    float:left;
    width:auto;
    text-decoration:none;
    font:bold 1em/1em Arial, Helvetica, sans-serif;
    text-transform:uppercase;
    text-shadow: 0px 0px 0px #555;
    background-color:black;
    }
    #nav a:hover,{
    color:maroon;
    padding:5px 5px 4px 5px;
    float:left;
    width:auto;
    text-decoration:none;
    font:bold 1em/1em Arial, Helvetica, sans-serif;
    text-transform:uppercase;
    text-shadow: 0px 0px 0px #555;
    background-color:orange;
    }
    #nav a:focus,{
    color:black;
    padding:5px 5px 4px 5px;
    float:left;
    width:auto;
    text-decoration:none;
    font:bold 1em/1em Arial, Helvetica, sans-serif;
    text-transform:uppercase;
    text-shadow: 0px 0px 0px #555;
    background-color:grey;
    }
    #nav a:active,{
    color:orange;
    padding:5px 5px 4px 5px;
    float:left;
    width:auto;
    text-decoration:none;
    font:bold 1em/1em Arial, Helvetica, sans-serif;
    text-transform:uppercase;
    text-shadow: 0px 0px 0px #555;
    background-color:red;
    }

    --></style>

    die url ist http://www.abendakademie-heine.de

    gruß und dank

  • Zitat

    #nav a:hover,{


    Wie boardraider sagte: Notationsfehler. Komma nur wenn es auch was zum trennen gibt. Wird nur eine Angabe gemacht, ist das Komma falsch und MUSS weg. Das die alten IEs das anzeigen, liegt daran das die eine andere Fehlerkorrektur betreibt wie die anderen Browser. Fehlerkorrektur ist ja auch nicht geregelt, wie es z.B. korrektes CSS ist. Da darfs dann gern mal unterschiedlich aussehen. Keinem Browser kann man vorwerfen den Fehler nicht "richtig" korrigiert zu haben. Der IE würde sich schon an einem Anführungszeichen im CSS aufhängen, was andere Browser wiederum kalt lässt. Diese Liste lässt sich beliebig weiterführen. Dass es meist aussieht das der IE es richtig macht, liegt vor allem daran das bei solchen Seiten oft nur der IE getestet wurde. Mit Hilfe von Entwicklungswerkzeugen wie Validatoren wäre das Problem ohnehin so nicht aufgetreten.

    Wenn du mal was zum lachen haben willst, kannst du ja mal versuchen im alten IE das Hover auf andere Elemente wie den <a>-Tag anzuwenden. Dann merkst Du schnell WIE unterschiedlich die Sache sein kann. ^^

  • super!!!!

    vielen dank - mache diese website als gefälligkeitsdienst für einen freundes freund. bin komponist und pianist und nur so nebenher als admin und unterwegs. web programmingeigentlich nur in eigener sache.

    nochmals vielen dank für die schnelle reaktion
    :D

  • Quelle: Wawuschel

    Zitat von Wawuschel

    diesen "Hover-Effekt" gibt es nur im IE - nicht bei Opera, nicht bei Safari und auch nicht in Fx

    Selbstverständlich kennt auch der Fx die Pseudoklassen wie :hover oder :visited. Fahr doch einfach mal über einen Link hier im Forum.

  • uups - hab mich nur unglücklich ausgedrückt...
    anstatt "gibt es" meinte ich eigentlich "sehe ich".
    Ich wollte ja nur mein Testergebnis mitteilen.
    sorry für diese Inkorrektheit.

    Gruß
    Wawuschel