Unterschiedliche Hintergrundbilddarstellung IE vs. FF ?

  • Hallo.

    Ich versuch' mich mal an einer Erklärung meines Problems:

    Ich hab ein Problem mit der Hintergrunddarstellung im FF;
    Mein Hintergrundbild hat die Größe 490x80 (px). Im IE wird das Hintergrundbild (in einem div-Block) korrekt angezeigt. Das selbe Bild wird im FF verkleinert dargestellt (Höhe ca.60px).
    Wie bekomme ich den FF jetzt dazu das Bildchen in der richtigen Auflösung anzuzeigen?

    Lange Erklärung, keiner hat's verstanden :D
    Hier mal der Screenshot dazu:
    http://www.berkling.net/store/screenshot.jpg

    Ich verwende HTML 4.01 strict.dtd
    CSS:
    div#top { display:block; position:relative; border:solid 1px red; width:700px; height:80px; padding:0px; text-align:left }
    div.home { background-image:url(../images/banner_home.jpg); background-repeat:no-repeat; background-attachment:fixed; background-position:210px top }

    HTML:
    <div>Hallo</div>
    (Selbstverständich mit id=top und class=home, keine Ahnung warum ich das nicht im Forum eintragen kann.)

    Hoffentlich weiß jemand von euch eine Lösung. Danke im Vorraus

  • Anscheinend hat der FF das Bild nicht verändert, sondern verschoben.
    Nach dem Löschen der Anweisung: "background-attachment: fixed" aus dem CSS, stellt nun auch der FF das Bild korrekt dar.

    Woher die unterschiedliche CSS Auslegung kommt und was jetzt die "richtige" Auslegung ist, kann ich nicht sagen.
    Im Zweifel gilt immer; IE ist schuld :lol:

    Schönen Tag, Gruß

    Moe

  • Wenn du ein bisschen nach unten scrollst, wird das Hintergrundbild vermutlich auch einfach nach oben aus dem div-container herausgeschoben.
    background-attachment:fixed positioniert das Hintergrundbild nämlich fest an einer absouluten Position innerhalb des Browserfensters. (Und die verändert sich beim scrollen auch nicht.... Das ist eigentlich der Sinn von dieser Anweisung, der IE kann nur gar nichts damit anfangen und ignoriert sie)

    D.h. dein Bild hatte im Firefox korrekterweiße den Abstand 0 zur Oberen Ende des Browserfensters (über background-position:.... top; festgelegt).

    Gruß Hannes

    PS: Für die Zukunft zwei Dinge:
    1)Ein Link, wo man sich das ganze anschauen kann ist meist seeehr hilfreich. Aus einem Bild kann man keinen Quellcode rauslesen.
    2) Um Quellcode richtig im Forum darzustellen, setz einfach nen Haken bei [X] HTML in diesem Beitrag deaktivieren. (Unter dem Post-Eingabefeld)

    Signaturen sind doof.

  • Hallo Hannes.

    Ich kann mich täuschen, aber ich glaube mit HTML4.01-Strict funktioniert keine fixe Positionierung (Wasserzeicheneffekt) mehr, weder bei IE noch FF. Hab jetzt leider keine Zeit um es mal auszuprobieren, aber im Job hab ich es kürzlich probiert ("Schlechten" HTML Code in korrekten Code umschreiben) und es hat nicht mehr funktioniert.


    Zu 1) Hätte ich ja gerne gemacht, nur hast du (hoffentlich :wink:) keinen zugriff auf meine C: Platte. Inzwischen ist meine "Testseite" Online, wenn du also gesteigertes Interesse hast, dann schick ich dir den Link :) Aber jetzt geht ja alles und sogar die Validierung des W3C hat die Seite überstanden.

    Zu 2) thx, wird mir beim nächsten Mal weiterhelfen.
    Gruß

    Moe