background-position: Das sind keine 10 %!

[MudGuard]

Hi,

ich bastel gerade an meiner Seite, und hab vor da im Hintergrund einen Streifen anzuzeigen... Den Streifen hab ich mittels background-position auf 10 % vom linken Rand entfernt gelegt (body), darüber liegt ein <ul> ebenfalls 10 % vom linken Rand weg... Nur leider sind sich jetzt 3 Browser (IE, Gecko, Opera) einig, dass die 10 % im Hintergrund ein bisschen kleiner sind als die 10 %, mit denen das Element positioniert wird...

Weil das anders definiert ist.

Bei der Hintergrund-Position bedeuten xx Prozent, daß der Bildpunkt, der xx Prozent der Bildbreite/-höhe entspricht, auf xx Prozent der Elementbreite/-höhe positioniert wird.

Beispiele (horizontale Position):
bei 0% wird die linke Kante des Bildes an die linke Kante des Elements gelegt.
bei 50% wird die Bildmitte in die Elementmitte gelegt.
bei 100% wird die rechte Kante des Bildes an die rechte Kante des Elements gelegt.

Bei 10% sind demnach 10% des Bildes links von der Linie, die 10% der Elementbreite entspricht.

cu,
Andreas