Flo: CSS - Probleme beim FF

Hi!
Irgendwie klappt bei mir was nicht!
Wenn ich meine Seite der Musikschule (siehe Link) öffne, sehe ich im Internetexplorer das Akkordeon, welches ich mittels CSS als Hintergrundbild eingebunden habe, unten in der Mitte! Aber im Firefox ist es nur mittig und nicht unten! Wie kommt das?

Genauso verhält es sich mit den zwei Streifen links und rechts!

Gruß Flo

  1. Hallo,

    Irgendwie klappt bei mir was nicht!
    Wenn ich meine Seite der Musikschule (siehe Link) öffne, sehe ich im Internetexplorer das Akkordeon, welches ich mittels CSS als Hintergrundbild eingebunden habe, unten in der Mitte! Aber im Firefox ist es nur mittig und nicht unten! Wie kommt das?

    Du hast keine kompletten Dokumenttyp-Deklarationen angegeben. Deshalb befinden sich die Browser im Quirks-Modus. In diesem Modus multiplizieren sich die ohnehin vorhandenen Browserunterschiede noch. Schicke deshalb alle Browser, die das können (das sind alle halbwegs aktuellen), in den Standard-Compliance-Modus. Das schaffst Du mit vollständigen Dokumenttyp-Deklarationen, inklusive "http://www.w3.org..."-URLs. Dann sollte Dein Hintergrundbild auch im IE dort stehen, wo es im Firefox jetzt schon steht.

    Nun, warum ist das so? Du hast das Hintergrundbild per CSS für das BODY-Element definiert. Der BODY ist so hoch wie der Inhalt, der darin steht, wenn keine andere Angabe für height gemacht ist. Height für BODY vorzugeben, wird aber wenig sinnvoll sein. Gib deshalb im CSS heigth:100%, dann aber margin-top:0, margin-bottom:0, padding-top:0, padding-bottom:0 für HTML vor und setze das Hintergrundbild für das HTML-Element.

      
    html { height:100%; margin:0; padding:0; background-image: url(bild/logo.gif); background-position: center bottom; background-color:  #ffcc33; background-repeat: no-repeat; }  
    
    

    viele Grüße

    Axel

    1. Hallo,

      Du kannst das Hintergrundbild auch im BODY belassen und zusätzlich background-attachment:fixed setzten. Dann orientieren sich die Angaben für background-position grundsätzlich am ViewPort.

      Einfach mal probieren, welche Variante besser passt.

      viele Grüße

      Axel

      1. Danke!
        Jetzt funktionierts, so wie ich möchte! Danke vielmals!

        Gruß Flo