umschuelerths
Goto Top

CSS: Unterschiedliche Höhe in Firefox zu Chrome

Guten Abend zusammen,

bei meiner Positionierung in CSS habe ich das Problem, dass in Firefox das Bild ca. 10px höher ist, wie in Chrome.
Ich habe schon einiges Probiert, aber komme auf keinen grünen Zweig.

• unter Top: margin: 0; padding: 0;
• normalize.css
• Elternklasse "position:absolute;" und img Klasse "position:relative;"
• display:flex;

alles hat kein gleiches Ergebnis gebracht..

Hier mal mein Code:

HTML:
<div class="icopic">  
            <center><img src="img/pin_logo.ico" /></center>  
        </div>

CSS:
.icopic img{
    height: 50px;
    width: 50px;
    top: 770px;
    left: 15px;
    position: relative;
    z-index: 2;
}

Vielen Dank & noch einen schönen Abend
Kevin
right
false

Content-Key: 847049456

Url: https://administrator.de/contentid/847049456

Printed on: April 23, 2024 at 14:04 o'clock

Member: Frank
Frank Jun 29, 2021 at 00:00:36 (UTC)
Goto Top
Füge mal zum CSS ".icopic img" folgendes hinzu: font-size: 0;
.icopic img{
    height: 50px;
    width: 50px;
    top: 770px;
    left: 15px;
    position: relative;
    z-index: 2;
    font-size: 0;
}

P.S. warum fügst du die Screenshot nicht direkt bei uns hinzu (klick auf das Bilder-Icon) und verweist auf externe Links? Da wird niemand hier drauf klicken.
Member: UmschuelerThs
UmschuelerThs Jun 29, 2021 at 07:56:12 (UTC)
Goto Top
Servus Frank,
hat leider auch nichts gebracht.. bleibt bei dem Unterschied...

i.d.R. hat man doch ne Sandbox für sowas :D Ne Quark hab Sie nochmal angehangen.

Gruß Kevin
Member: em-pie
Solution em-pie Jun 29, 2021 updated at 10:13:47 (UTC)
Goto Top
Moin,

die "spannende" Frage ist auch noch, was ist um dein <div> </div> herum vorhanden.

Nicht, dass dir da ein anderer Tag oder eine vergessene Spitze Klammer in die Suppe spuckt und es gar nichts mit deinem obigen Schnipsel zu tun hat. Auch ein Leerzeichen resp. &nbsp;  kann schon für einen unterschied sorgen.

Zwar müsste es dann - theoretisch - gleich sein, aber in meinen frühen HTML-Gehversuchen ist mir das auch mal untergekommen. Firefox hat einen von mir versehentliche Fehler ignoriert und alles korrekt dargestellt, der damalige IE6 hat da irgendwo ne Lücke "eingebaut"...

Schaue also auch einmal "links und rechts" ober- und unterhalb deines Icons nach Fehlern...

Gruß
em-pie
Member: UmschuelerThs
UmschuelerThs Jun 29, 2021 at 10:08:35 (UTC)
Goto Top
Zitat von @em-pie:

Moin,

die "spannende" Frage ist auch noch, was ist um dein <div> </div> herum vorhanden.

Nicht, dass dir da ein anderer Tag oder eine vergessene Spietze Klammer in die Suppe spuckt und es gar nichts mit deinem obiegn Schnipsel zu tun hat.
auch ein Leerzeichen resp. &nbsp; kann schon für einen unterschied sorgen.

Zwar müsste es dann - theoretisch - gleich sein, aber in meinen frühen HTML-Gehversuchen ist mir das auch mal untergekommen. Firefox hat einen von mir versehentliche Fehler ignoriert und alles korrekt dargestellt, der damalige IE6 hat da irgendwo ne Lücke "eingebaut"...

Schaue also auch einmal "links und rechts" ober- und unterhalb deines Icons nach Fehlern...

Gruß
em-pie

Jop, das war tatsächlich das Problem. Hatte ich gestern Abend auch noch dran gedacht, war aber dann auch einfach zu Platt.
Also es war noch ein </div> zu viel unterwegs .. Unglaublich.
Ich danke dir vielmals.