Hintergrund gekachelt oder nicht IE Firefox

[helaukoenig]

Werft doch mal einen Blick auf folgende Adresse Jugend VfB Bad Sachsa: Das Problem ist die Navigationsleiste rechts. Eigentlich ist dies ein div-Layer mit fester Position und Größe, dem ein Hintergrundbild zugewiesen wurde, das genau so groß ist, wie der Layer.
Im IE ist die Darstellung auch wie gewünscht, nur im Firefox wird das Hintergrundbild gekachelt.
Woran liegt es? Was kann ich dagegen machen?

Vielen Dank

und in Erwartung eines sonnigen WE

 

[Maik]

Hi,

reduzier mal die Breiten- und Höhenangabe für die Navigation um den gesetzten Innenabstand - also: 139px - 2*10px = 119px, sowie 324px - 2*10px = 304px.

Da das Dokument derzeit im Quirksmode übergeben wird, ignoriert der IE das Boxmodell und addiert die padding-Werte nicht zur Breiten- und Höhenangabe hinzu.

Firefox hingegen interpretiert den CSS-Code richtig und stellt demnach die Box 159px breit und 344px hoch dar, was zur Bildwiederholung führt, da das Hintergrundbild 139*324px groß ist.

 

[helaukoenig]

Ja, aber das wirft doch wiedeer neue Probleme für das Design auf: nämlich mindestens ein verzerrtes Hintergrundbild oder Text, der nicht mehr passt.
Vielleicht sollte ich sicherheitshalber mit zwei Layern arbeiten, die genau übereinander platziert werden.
Ich werde an dieser Stelle von den Fortschritten berichten.

Vielen Dank.

 

[Maik]

Hi,

wieso sollten sich da Verzerrungen ergeben, wenn du den Innenabstand von der derzeitigen Breiten- und Höhenangabe subtrahierst, um auf die gewünschte Breite und Höhe zu kommen?

Lies dir einfach mal den Abschnitt http://www.css4you.de/wsboxmodell/index.html#buh durch, wie sich das Boxmodell im Einzelnen zusammensetzt.