Einzelnen Beitrag anzeigen
  #1 (permalink)  
Alt 21.06.2007, 21:39
recreation-studios recreation-studios ist offline
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 20.06.2007
Beiträge: 1
recreation-studios befindet sich auf einem aufstrebenden Ast
Ausrufezeichen [CSS] Firefox Problem

Hallo Community

Auch für mich kommt mal die Zeit, in der ich Hilfe brauche.
Folgendes Problem:

Ihr seht anhand des nachfolgenden Codes und Beispiels, wie sich beim "hover"n das Bild in der Horizontale verschieben sollte, um somit einen Bildertausch hervorzurufen.
Ich habe praktisch 2 Bilder in 1, schneide dieses jedoch in der Hälfte, und verschiebe es beim "hover"n, um den anderen Teil sichtbar zu machen.

Das Problem dabei ist, dass ich ausschließlich bei der Darstellung in Firefox das Bild nach UNTEN verschoben bekomme. IE, Opera funktionieren einwandfrei.

Code:

Code:
<html>
 * *<head>
 * * <style type="text/css">
 * * * * * *a, a:hover, a:link, a:visited, a:active
 * * * * * * {
 * * * * * * *overflow:hidden;
 * * * * * * *display:inline-block;
 * * * * * * *margin:0px; padding:0px;
 * * * * * * *border:0px;
 * * * * * * }
 * * * * * *a#home, a#home:link, a#home:visited
 * * * * * * {
 * * * * * * *background: transparent url("test.gif") no-repeat 0px 0px;
 * * * * * * *width:50px; height:50px;
 * * * * * * }
 * * * * * *a#home:hover, a#home:active
 * * * * * * {
 * * * * * * *background-position: -50px 0px;
 * * * * * * }
 * *</style>
 * </head>
 * <body>
 * * * * <a href="" id="home"><img src="frei.gif" style="width:50px;height:50px;border:0px;" alt="" /></a>
 * </body>
</html>
Beispiel: klick

Das
Code:
display:inline-block;

bzw.

display:inline;
benötige ich ja nur, da daraus eine einzeilige Navigation entstehen soll.

Analyse:

Opera:
  • display: inline; -> Fehler
  • display: inline-block; -> funktioniert!
  • ohne display -> Fehler
IE:
  • display: inline; -> funktioniert!
  • display: inline-block; -> funktioniert!
  • ohne display -> funktioniert!
FF:
  • display: inline; -> Fehler
  • display: inline-block; -> Fehler
  • ohne display -> Fehler
Wie kann der Fehler jetzt an Firefox liegen, wenn ich bei den beschriebenen Optionen in Opera genauso bekomme?

Würde mich freuen, wenn jemand ne Antwort dazu parat hätte!

Liebe Grüße,

Tobias Klika
Mit Zitat antworten
Sponsored Links