Professor Hase: OPERA- und FIREFOX- Verhalten bei gekacheltem Hintergrund

Hallo Forum,

ich kann das Entstehen eines Effektes bei OPERA und FIREFOX nicht nachvollziehen und bitte um erklärende Hilfe.

Ausgangspunkt ist eine Testseite ohne Inhalt mit einer gekachelten Hintergrundgrafik. So weit, so gut.

Nun erweitere ich diese Seite mit einem div-Container, in dem eine Überschrift und ein Absatz stehen. Weder der div-Bereich, noch Überschrift und Absatz haben derzeit CSS-zugeschriebene margin- oder padding-Eigenschaften. Es entsteht somit die Testseite 2 und das gekachelte Hintergrundmuster schaut _noch immer_ normal aus. (Es geht mir hier rein um einen Hintergrundeffekt, ich _weiß_, daß die Schrift nicht oder schwer lesbar ist wegen zu wenig Kontrast, aber das ist jetzt irrelevant.)

Wenn ich jetzt aber der Überschrift und dem Absatz eine margin-Eigenschaft zuweise, es entsteht somit Testseite 3, dann verschiebt sich im FIREFOX und im OPERA plötzlich die Hintergrundkachel.

Interessant ist dabei, daß, wenn man der Überschrift und dem Absatz statt dem margin eine padding-Eigenschaft gibt, es entsteht somit Testseite 4, dann ist der Hintergrund wieder homogen.

Gebe ich jetzt dem div-Container ein margin (Testseite 5) oder dem body ein padding (Testseite 6), kommt es _wieder_ zur Verschiebung, im letzteren Fall sogar horizontal _und_ vertikal.

Woran liegt das alles? Es sind in _allen_ Seiten die Initialwerte auf Null gesetzt (siehe die entsprechenden CSS-Files) und die Seiten sind valide.

Und anders gefragt: Wie sonst, außer mit einem padding für body oder einem margin für den div-container bekomme ich selbigen aus der Ecke, _ohne_ daß sich die Hintergrundkacheln verschieben. Und natürlich will ich auch der Überschrift und dem Absatz ein margin bzw. padding geben, _ohne_ daß sich die Hintergrundkacheln verschieben.

Bitte helft mir von der Leitung runter!

Vielen Dank im Voraus

Professor Hase

  1. Hallo Prof

    Bitte helft mir von der Leitung runter!

    IMHO kannst du diese Effekte umgehen indem du body kein Hintergrundbild gibst. Momentan hat html und body das Hintergrundbild. Durch die zusätzlichen Elemente bekommt body dann Abstände. (Frag mich nicht woher)

    thebach

    --
    selfcode: ie:% fl:( br:> va:) ls:& rl:( n4:~ ss:| de:> js:( ch:? mo:} zu:)
    "Egal, ob ein Sandkorn oder ein Stein. Im Wasser sinken sie beide."
  2. Hi,

    Wenn ich jetzt aber der Überschrift und dem Absatz eine margin-Eigenschaft zuweise, es entsteht somit Testseite 3, dann

    verschiebt sich im FIREFOX und im OPERA plötzlich die Hintergrundkachel.

    works as specified. Stichwort "collapsing margins".

    cu,
    Andreas

    --
    Warum nennt sich Andreas hier MudGuard?
    O o ostern ...
    Fachfragen unaufgefordert per E-Mail halte ich für unverschämt und werde entsprechende E-Mails nicht beantworten. Für Fachfragen ist das Forum da.
    1. Hi Andreas,

      works as specified. Stichwort "collapsing margins".

      Danke für das Stichwort.

      Wie sonst, außer mit einem padding für body oder einem margin für den div-container bekomme ich selbigen aus der Ecke, _ohne_ daß sich die Hintergrundkacheln verschieben. Und natürlich will ich auch der Überschrift und dem Absatz ein margin bzw. padding geben, _ohne_ daß sich die Hintergrundkacheln verschieben.

      Hast Du diesbezüglich auch eine Antwort/Hilfestellung? Mir würden nur noch 2 zusätzliche divs einfallen.

      Mit freundlichen Grüßen

      Professor Hase

      1. Hi,

        Hast Du diesbezüglich auch eine Antwort/Hilfestellung? Mir würden nur noch 2 zusätzliche divs einfallen.

        gebe die CSS-Regeln einfach nur für body an. Doppelt gemoppelt ist nicht immer besser... ;-)

        freundliche Grüße
        Ingo