MSIE 7 Sorgenkind mit z-index

[Beat]

MSIE Korrektur.
Ein schwieriger Patient.

Vorliegend folgende Struktur

<div #id1>
  <!-- ein menu -->
  ...
  <a style0"
        z-index:10
  ">Link</a>
  ...
</div>

<div #id2>
  ...
  <h2 style="
         border-bottom: 1px solid black;
  ">
     <span style="
         position: relative;
         top:      0.5em;
         z-index:  0;
         backgrozund-color:#abc;
     ">Label</span>
  </h2>
  ...
</div>

Bei hover über Menu (in einem navigationsmenu) überscheiden sich ganz regulär die Bereiche von Menu und #div > h2 > span
In FF liegt das Menu über dem span

Problem:
Der <span> scheint im MSIE durch den Link, wenn auf dem Link gehovert wird

Folgende Korrekturen habe ich versucht:

#id2 h2{ zoom:1;}
/* korrigiert schon mal die Lage für h2 (border) */

Fruchtlos blieben aber
#id2 h2 span{ zoom1; overflow:hidden; }

Der Versuch,
#id1:hover + #id2 h2 span{ }
auszunutzen, schlug fehl. Der Selektor scheint nicht zu greifen.
(Selektor greift im Firefox)

Gibt es einen Hack?
Derzeit habe ich einen unschöneren Hack

mfg Beat;

[EKKi]

Mahlzeit Beat,

MSIE Korrektur.
Ein schwieriger Patient.

Grundsätzlich ja ...

Vorliegend folgende Struktur

<div #id1>
  <!-- ein menu -->
  ...
  <a style0"
        z-index:10
  ">Link</a>
  ...
</div>

... aber dass das HTML fehlerhaft ist, ist Dir schon bewusst? Wieder mal der typische Fall von "per Hand abgetippt"? :-)

MfG,
EKKi

[Beat]

Mahlzeit Beat,

MSIE Korrektur.
Ein schwieriger Patient.

Grundsätzlich ja ...

Vorliegend folgende Struktur

<div #id1>
  <!-- ein menu -->
  ...
  <a style0"
        z-index:10
  ">Link</a>
  ...
</div>

... aber dass das HTML fehlerhaft ist, ist Dir schon bewusst? Wieder mal der typische Fall von "per Hand abgetippt"? :-)

Das Sorgenkind ist strict valide.
hiessiger Code war zu eurer besseren Lesbarkeit "gelistet".
Ist natürlich alles ausgelagert.

gemeint war:
<a style="z-index:10;">Link</a>

Ich schmeiss die Seite mal hoch:
http://www.elcappuccino.ch/privat_ec/save-js2col-layout.html

Im MSIE 7 bitte die Navigation bedienen.
Besonders das zweite von Rechts ist schlecht navigierbar.

mfg Beat;

[ChrisB]

Hi,

Ich schmeiss die Seite mal hoch:
http://www.elcappuccino.ch/privat_ec/save-js2col-layout.html

Im MSIE 7 bitte die Navigation bedienen.
Besonders das zweite von Rechts ist schlecht navigierbar.

Im Opera (9.62, Vista) ist das ganze Menue so gut wie ueberhaupt nicht bedienbar.

MfG ChrisB

[Beat]

Ich schmeiss die Seite mal hoch:
http://www.elcappuccino.ch/privat_ec/save-js2col-layout.html

Im MSIE 7 bitte die Navigation bedienen.
Besonders das zweite von Rechts ist schlecht navigierbar.

Im Opera (9.62, Vista) ist das ganze Menue so gut wie ueberhaupt nicht bedienbar.

Das dürfte wohl nur durch die Verwendung von display:inline-block für die Navigationslabels <li> Elemente zu erklären sein.
Dachte immer das Opera das versteht.

mfg Beat

[Beat]

http://www.elcappuccino.ch/privat_ec/save-js2col-layout.html
Im MSIE 7 bitte die Navigation bedienen.
Im Opera (9.62, Vista) ist das ganze Menue so gut wie ueberhaupt nicht bedienbar.
Das dürfte wohl nur durch die Verwendung von display:inline-block für die Navigationslabels <li> Elemente zu erklären sein.
Dachte immer das Opera das versteht.

Echt frustrierend. Opera ist noch schlimmer als MSIE

Jetzt habe ich die Version mit Block-inline, auf normal inline geändert.
Zudem erlebe ich ernsthafte Rendering probleme bei Opera. Kann aber mit dem gleichzeitigen Betrieb mit Firefox zu tun haben.

Auch MSIE hat ein Problem. Die Navigation ist erreichbar, wenn man zickig genug sie gebraucht. Es hat also keinen offensichtlichen Grund.

mfg Beat

[Beat]

Jetzt habe ich eine andere Variante des Bugs

Im MSIE 7 klappen die Menus zwar auf, aber sie klappen nicht mehr zu.
Scheisse...

Wer kennt das?
Was kann ich dagegen tun, ohne dass es wieder ein anderes Loch gibt?

http://www.elcappuccino.ch/privat_ec/save-js2col-layout.html

[Beat]

MSIE 7 rendert nun die Navigation adäquat.

Opera (9.27) jedoch weiss nicht, wo er die Dropdowns platzieren soll.
Ist dieser Bug in neueren Operas noch vorhanden?

http://www.elcappuccino.ch/privat_ec/save-js2col-layout.html

mfg Beat;

[ChrisB]

Hi,

Opera (9.27) jedoch weiss nicht, wo er die Dropdowns platzieren soll.
Ist dieser Bug in neueren Operas noch vorhanden?

http://www.elcappuccino.ch/privat_ec/save-js2col-layout.html

Sieht mit 9.62/Vista OK aus.

Ja, gerade was absolut-relative Positionierung angeht, war Opera lange Zeit ziemlich buggy. Das hat sich mit der 9.5er Version gebessert.

MfG ChrisB

[Beat]

Opera (9.27) jedoch weiss nicht, wo er die Dropdowns platzieren soll.
Ist dieser Bug in neueren Operas noch vorhanden?
http://www.elcappuccino.ch/privat_ec/save-js2col-layout.html

Sieht mit 9.62/Vista OK aus.
Ja, gerade was absolut-relative Positionierung angeht, war Opera lange Zeit ziemlich buggy. Das hat sich mit der 9.5er Version gebessert.

Gut, dann lass ich das mal so. Opera User werden ja eher zu neueren Modellen greifen.

Jetzt muss ich nur noch die very-small Screen Variante des Menus mit JS Unterstützung machen.

mfg Beat

[Beat]

Neues Problem bei Mini-Navigation für sehr kleine Fenster

MSIE 7 hat ein z-index Problem, wenn in die Mininavigation umgeschaltet wird.

Java-script erforderlich
Fenster bitte < 50% stellen.

PS: bin auch für andere Browserberichte dankbar.

http://www.elcappuccino.ch/privat_ec/save-js2col-layout.html

mfg Beat

[Beat]

http://www.elcappuccino.ch/privat_ec/save-js2col-layout.html

Ich habe das Problem nicht gefixt, aber eine andere Methode (float) für MSIE gewählt. Das Ergebnis ist damit praktisch gelöst.

Unterschied:
Normale browser haben für das <li> Element, das das label beinhaltet, display:block.
MSIE hat nun für dieses Element float:left erhalten.

mfg Beat

[cygnus]

Hallo :)

Wenn man das Fenster so eng stellt, dass die Navigation vertikal steht, erscheint beim Hovern mit der Maus über einen Link der Hinweis "Homepage Navigation" und verdeckt einen Teil des aufklappenden Menus. Beim Link "Layout" beispielsweise ist das aufklappende Menu mit dem einzigen Link "Easy Maroon" überhaupt nicht sichtbar.
Der Hinweis stört und ist auch unnötig.
Ausserdem rutschen die drei Links oben rechts (Navigation, Inhalt, Beigaben) in die Überschrift hinein und überlagern sie, dabei wären sie gerade bei kleinem Fenster wichtig, um ausserhalb des Sichtbereiches liegenden Text per Link zu erreichen. Sie wären in einer Zeile unterhalb des Überschriftentextes besser zu sehen und anzuklicken.

Safari, FF3: Bei vertikaler Darstellung der Links erscheint unten ein Scrollbalken, weil die Navigationsleiste über die eigentliche Seitenbreite hinausragt.
Dies ist nicht der Fall beim MSIE 7.

mfg
cygnus