Browser interpretieren Pixel unterschiedlich

[christopher2007]

Hallo alls zusammen,

ich habe gerade etwas sehr eigenartiges feststellen müssen, als ich an miener Website programmiert habe!

Dort verwende ich ein normales div, das über eine css die Höhe 63px bekommen hat. Opera und Firefox haben auch kein Problem damit, es in dieser Größe darzustellen.

Jedoch zeigen Chrome, Safari und der IE das div viel höher an!
(darin befindet sich ein Bild, was genau so groß wie das Div ist, also eine Höhe von 63px hat. Aber in Chrome, Safari und IE ist das Div größer als das div.)
In diesen 3 Browsern passen das Bild und das div nur dann zusammen, wenn ich eine Höhe von 55px angebe.

Aber das ist total komisch, weil wenn ich dann einen screenshot vom Monitor mache, und die pixel nachzähle, so komme ich zu dem ergebnis, dass das Bild 63px hoch ist (das soll es ja sein), und das div ausen herum auch 63px groß ist, wenn auch im quelltext 55px steht!

Und wenn ich im Quelltext 55px stehen habe, so ist es logischerweise im Poera und im FIrefox zu klein!

Erst dachte ich, dass nur der IE diesen Anzeigefehler hat, worauf ich einfach ein <!--[if IE]> eingebaut habe, als Ausnahme für den IE, aber das Chrome un dSafari auch den Fehler machen hab ich wie gesagt erst gerade bemerkt!

Woran könnte das also liegen?
Danke für schnelle und gute Antworten schon mal im Vorraus!

glg
Christopher

 

[pixelflat]

Poste mal bitte etwas Quelltext...

:shift:

 

[christopher2007]

danke für die Antwort, aber mitlerweile hab ich es shcon gelöst^^
Denn Es war ein Bild das 2 Geteilt war, oben und unten stellte es jeweils einen Button dar, einmal hell und einmal dunkel.
Eigendlich sollte man normalerweise den hellen button sehen und wenn man darüber fährt wird er dann dunkel, dies wird erreicht, indem das Bild verschoben wird (beide buttons sind in einem Bild untereinander angeordnet!).

Hier mein Ansatz:
Vorher habe ich ein Div benutzt, dass feste Maße hatte (höhe und breite). Normal habe ich das Bild darin so ausgerichtet, dass wenn die Maus das Div nicht berührt, es oben angedockt war. Fährt man mit der Maus darüber, so wurde das Bild am unteren rand des Divs ausgerichtet. Da aber in verschiedneen Browsern das Div unterschiedlich groß war hat es sich immer verschoben, wenn man mit der Maus darüber fährt!

Jetzt habe ich das Bild beim darüber fahren mit der Maus nicht unten andocken lassen, sondern es oben gelassen, allerdings einfach un die 63px nach oben verschoben.
background: url("../images/buttons/botton-3.png") no-repeat scroll 50px -63px transparent;

Allerdings besteht das Problem weiterhin, dass in verschiedenen Browsern die Pixelangaben verschiedengroß ausfallen!
Aber woran liegt das? Denn anfürsich ist das ja schlimm, wenn in jedem Browser die Angaben anders angewendet werden!

glg
Christopher

PS.: Und danke für das Verschieben des Themas, da hab ich wohl einen Fehler gemacht gehabt 😉