Problem z-index im Firefox 2

RaVenC

Mitglied
Hi,
Ich habe ein z-index Problem mit Firefox 2.. (wie es im Firefox 3 aussieht weiß ich nicht)
Irgendwie möchte das gewünschte div Element nicht über das andere Div Element..
Lässt sich schlecht erklären ^^

Klickt einmal in der folgenden html auf Optionen, dann seht ihr das die erscheinende Box untergeordnet ist, trotz zugewiesenem z-index:100

http://www.dunewar.de/files/design/test.html

Die css Datei (damit ihr nicht im Quellcode suchen müsst ;) )
http://www.dunewar.de/files/design/game.css

Im IE und in Opera funktioniert alles so wie es soll..
Aber wie gesagt im Firefox nicht..
Hab auch schon google und die Forensuche beansprucht.. allerdings nichts brauchbares gefunden :(

Viele Grüße
 
Hi,

stock mal für .content die Schichtpositionierung auf:
CSS:
div.content{
  margin-left:30px;
  width:770px;
  text-align:center;
  z-index:100; /* "0" sitzt zu weit unten */
  position:relative; /* erforderlich für Schichtpositionierung */
}

mfg Maik
 
hmm.. hab ich gerade getan..
hat auch nicht gebracht, abgesehen davon, dass der Spaß nun auch im IE und Opera nichtmehr geht ^^

Hab die css mal auf dem Server aktualisiert ;)
 
Dann solltest du das "Popup" im Markup besser außerhalb von .content notieren, denn die Boxen mit der Klasse .floatLeft, in der sich auch das "Popup" befindet, überdecken sich gegenseitig in der Schichtposition - hierbei gilt: Wer zuletzt kommt, sitzt in der Schichtposition ganz oben. In deinem Fall sind dies die nachfolgenden Boxen mit "Highscore", "Spice", usw.

mfg Maik
 
hrmpf..
Na ok, ich danke Dir vielmalst..
Ich habe mich jetzt dazu entschieden das Menü anderst ein zu bauen..
Bevor ich mich da jetzt stundenlang daran aufhalte.. :(
 
Für den Fall der Fälle:
HTML:
<body>
<div class="main">
         <div class="hidden" id="quickOptionBox">
              <div class="title">
              <!--[if IE]></div><div class="title filter"><![endif]-->
                allgemeine<br />
                IP-Sharing melden<br />
                Bild Upload<br />
                Bug melden<br />
                spenden
              </div>
         </div>
         ...
</div>
</body>
CSS:
div.main{
  margin: 0 auto;
  height:100%;
  width:1000px;
  position:relative;
}

div.optionPopup{ position:absolute; z-index: 100; width:200px; top:20px; left:230px; }

mfg Maik
 
Danke dir,
hab es so ähnlich doch noch realisiert ^^
CSS:
div.optionPopup{ position:absolute; z-index: 100; width:200px; margin-left:50%; left:-270px; top:18px; }

Der Unterschied zu deinem ist, dass es so bei jeder Auflösung unter Optionen erscheint :)
 
Ja, allerdings relativ von der Ecke links oben ;)

.: edit :.
Bitte mein Einfallen zu entschuldigen ^^
Habs bei mir unter den Body geschrieben ;)
Du wolltest es im .main ^^
 
Zurück