mediengestalter.info
FAQ :: Mitgliederliste :: MGi Team

Willkommen auf dem Portal für Mediengestalter

Aktuelles Datum und Uhrzeit: Fr 29.03.2024 10:17 Benutzername: Passwort: Auto-Login

Thema: z-index:-1 im IE vom 27.11.2007


Neues Thema eröffnen   Neue Antwort erstellen MGi Foren-Übersicht -> Allgemeines - Nonprint -> z-index:-1 im IE
Autor Nachricht
efeqtif
Threadersteller

Dabei seit: 18.06.2007
Ort: Berlin
Alter: -
Geschlecht: -
Verfasst Di 27.11.2007 16:20
Titel

z-index:-1 im IE

Antworten mit Zitat Zum Seitenanfang

hej hej

ich finde grad die lösung für ein problem nicht, und hoffe, ihr könnt mir helfen.

folgendes :

ich habe eine navigation, der ich runde ecken zuweisen möchte. durch einfache schmale grafiken oben und unten kann ich diesen effekt nicht erzeugen, da die navipunkte bei mouseover ihre hintergrundfarbe ändern. die navi wird dynamisch erstellt, somit kann ich dem oberen und unteren navipunkt keine eigene klasse geben, würden die genannten schmalen grafiken oben und unten die runden ecken erzeugen, würde deren hintergrundfarbe (grau) sich bei mousover nicht ändern.

jetzt habe ich versucht, es mit relativen divlayern zu umgehen, einer, der im div der navi liegt, mit z-index:2, dass er über dem ersten navi punkt die runden ecken erzeugt (transparentes gif mit weißen runden links und rechts) und der eigentliche div layer, in dem die navi ist, mit z-index:1, als hintergrund das transparente gif für die unteren ecken und background-position:bottom. die navi punkte werden mit display:block zu kästen und bekommen den z-index:-1, damit sie unter den divs liegen, die die runden ecken erzeugen. navi punkte und das div um den navi für die unteren runden ecken haben dazu noch ein position:relative.

im firefox funktioniert es wunderbar, nur der internet explorer macht mucken. die unteren ecken werden nicht angezeigt. die oberen ecken hingegen wunderbar.

hier css und html code :

Code:

div#navigation {
   background-image:url(bilder/rund_oben.gif);
   background-repeat:no-repeat;
   z-index:2;
   width:200px;
   position:absolute;
}

div#navigation_add {
   background-image:url(bilder/rund_unten.gif);
   background-repeat:no-repeat;
   background-position:bottom;
   z-index:3;
   position:relative;
}

a.navi, a.navi:LINK, a.navi:ACTIVE, a.navi:VISITED {
   display:block;
   padding-left:10px;
   padding-top:4px;
   padding-bottom:4px;
   background-color:#e3e4e5;
   font-size:12px;
   border-bottom:1px solid #cdced0;
   color:#000;
   position:relative;
   text-decoration:none;
   z-index:-1;
}

a.navi:HOVER {
   display:block;
   padding-left:10px;
   padding-top:4px;
   padding-bottom:4px;
   background-color:#cdced0;
   font-size:12px;
   border-bottom:1px solid #cdced0;
   font-weight:bold;
   color:#000;
   position:relative;
   text-decoration:none;
   z-index:-1;
}


Code:

<div id="navigation_add">
               <div id="navigation"><img src="bilder/rund_oben.gif" /></div>
               <a href="#" class="navi">Startseite</a>
                <a href="#" class="navi">Das Unternehmen</a>
                <a href="#" class="navi">Unsere Mission</a>
                <a href="#" class="navi">Projekte</a>
                <a href="#" class="navi">Kontakt</a>   
            </div>


hat jemand von euch erfahrung damit gemacht? ich hab gelesen, dass der internet explorer nur bei position:fixed auf static zurück geht, und somit den z-index ignoriert. aber relativ müsste es doch gehen?

hoffe ich hab mich verständlich ausgedrückt.

danke

ef


Zuletzt bearbeitet von efeqtif am Di 27.11.2007 16:20, insgesamt 1-mal bearbeitet
  View user's profile Private Nachricht senden
joe

Dabei seit: 28.06.2005
Ort: berlin
Alter: -
Geschlecht: Männlich
Verfasst Di 27.11.2007 16:51
Titel

Antworten mit Zitat Zum Seitenanfang

Ich verstehe noch nicht ganz wie du das umsetzen willst und wie es dann letztlich aussehen soll. Hast du einen Link zu dem Menü? Nur der Code bringts nicht ganz, da es ja gerade um die Grafiken geht, die in deinem Beispiel aber nicht absolut verlinkt sind.

Außerdem: sind negativ-Werte in z-index erlaubt? Warum nicht einfach 15, 10, 5 oder so?
  View user's profile Private Nachricht senden
Anzeige
Anzeige
efeqtif
Threadersteller

Dabei seit: 18.06.2007
Ort: Berlin
Alter: -
Geschlecht: -
Verfasst Di 27.11.2007 16:58
Titel

Antworten mit Zitat Zum Seitenanfang

hm. mir sind negativ werte schon oft über den weg gelaufen, und demnach bin ich der ansicht, dass es erlaubt ist. vllt ist es aber auch ein CSS versions problem? ich hab versucht, den navi punkten den z-index:1 zu geben, und entsprechend den darüber liegenden divs 2 und 3, das wars aber auch nicht.

jedenfalls, hier der link : http://300l600.de/_ablage/navi/navi.html
  View user's profile Private Nachricht senden
sidisinsane

Dabei seit: 30.01.2006
Ort: Hamburg
Alter: 52
Geschlecht: Männlich
Verfasst Di 27.11.2007 17:34
Titel

Antworten mit Zitat Zum Seitenanfang

Ich habe Deinen Post nur bis ungefähr "runde Ecken" gelesen. Sofern es für Dich keinen zwingenden Grund gibt nicht auf Javascript zurückzugreifen, würde ich Dir die Nifty Cube Methode empfehlen. Ist sicherlich eleganter und unproblematischer.
Falls ich jetzt doch hätte weiterlesen sollen, dann vergiss meine Empfehlung einfach.
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
EnterYourName

Dabei seit: 14.06.2007
Ort: Hamburg
Alter: 36
Geschlecht: Weiblich
Verfasst Mi 28.11.2007 11:04
Titel

Antworten mit Zitat Zum Seitenanfang

Ich hatte neulich auch akute Probleme mit'm Z-index... Hab bei CSS4you nachgelesen, dass der z-index nur auf absolute-positionierte elemente anwendbar ist.
Wenn absolute-positionen für dich nicht in Frage kommen musst du wohl nach ner anderen lösung suchen :/
  View user's profile Private Nachricht senden
efeqtif
Threadersteller

Dabei seit: 18.06.2007
Ort: Berlin
Alter: -
Geschlecht: -
Verfasst Mi 28.11.2007 19:01
Titel

Antworten mit Zitat Zum Seitenanfang

vielen dank!

habe jetzt nifty genommen (danke für den tipp), leider hat es im IE nur die unteren ecken gerundet. aber mit if IE habe ich die oberen dann wieder über den absoluten div erzeugt.
  View user's profile Private Nachricht senden
 
Ähnliche Themen index-Datei
Index.php abfragen
Pop-up beim Index
css z-index ebenen
z-index und flash
Problem mit z-index
Neues Thema eröffnen   Neue Antwort erstellen
MGi Foren-Übersicht -> Allgemeines - Nonprint


Du kannst keine Beiträge in dieses Forum schreiben.
Du kannst auf Beiträge in diesem Forum nicht antworten.
Du kannst an Umfragen in diesem Forum nicht mitmachen.