# CSS Dropdown Menu



## Vetinari (30. Januar 2008)

Hallo,

ich habe ein Dropdown-Menü, hier der Link:
http://www.martinlanius.de/test.php
Das Dropdown Menu unter "Link 1" klappt aus, aber beim überfahren mit der Maus verschwindet es genau dort, wo der Text der Seite beginnt. Das Ganze passiert nur im IE, im Firefox ist alles OK. Mit dem z-index des Blocks hat es aber anscheinend nichts zu tun ...
Woran liegt das?

Gruss, Martin


----------



## Layna (30. Januar 2008)

Hallo.
Spontane idee: Der IE baut irgednwelche anderen Layer auf.
Versuch doch mal dem Menu ein z-index zu geben, und guck ob es dann funktioniert.

Layna


----------



## Vetinari (30. Januar 2008)

hatte ich ja schon:

ul.dropdown
{
    list-style: none;
    margin: 0;
    padding: 0;
    text-align: center;
    width: 100%;
    z-index: 99;
}

ul.dropdown * ul
{
    list-style: none;
    margin:0;
    padding: 0;
	display: none;
	position: absolute;
	z-index: 99;
	width: 13.5em;
}

ul.dropdown li
{
    list-style: none;
    float: left;  /* ohne width - nach CSS 2.1 erlaubt */
    position: relative;
    margin: 0; 
    padding: 0;
    z-index: 99;
}

scheint aber damit nix zu tun zu haben ...

gruss, martin


----------



## Maik (30. Januar 2008)

Hi,

kannst du mal die Quelle nennen, woher du das Menü hast, denn das Submenü schliesst sich im IE umgehend, wenn ich die übrigen Seitenbereiche aus dem Quellcode entferne.


----------



## Vetinari (30. Januar 2008)

von hier:
http://www.traum-projekt.com/forum/54-traum-scripts/45522-css-only-pulldown-men-js.html

habe es aber auf meine bedürfnisse umgeschrieben - und das sieht so aus:

<div id="top">
    <div id="navi_block">
        <ul><li></li></ul>
    </div>
    <div id="main">
        <div id="navigation">
        </div>
        <div id="content">
        </div>
    </div>
</div>

der navi_block ist so positioniert:

div#top>div#navi_block {
    width: 540px;
    margin-left: 476px;
    margin-top: 28px;
}

* html div#navi_block {
    width: 540px;
    margin-left: 476px;
    margin-top: 175px;
}

das heißt, dass menu muss erst mal über die box "main" und dann über die box "content" ausklappen. das lässt sich mit dem z-index machen. aber wenn dann der erste inhalt (text) in 'content' auftaucht, klappt das menü aus irgendeinem grund wieder zu.

gruss, martin


----------



## Maik (30. Januar 2008)

Im funktionstüchtigen Original-Beispiel wird das Dokument ohne Doctype-Angabe im "Quirksmode" übergeben, und du schaltest mit dem gewählten Doctype den IE in den "Standardsmode".


----------



## Vetinari (30. Januar 2008)

so etwas hatte ich befürchtet. 
Das Menü ist für eine umfangreichen Website, welche mich tagelange Arbeit gekostet hat, um das ganze CSS-Gerüst zum laufen zu bekommen. Dazu ist meine Doctype-Angabe zwingend notwendig.
Ich will halt nur wegen der Suchmaschinen-Robots weg von der jetzigen JavaScript Lösung ...
Hast du noch eine Idee, wie ich dem IE das Ganze auch im Standardmodus schmackhaft machen kann?

gruss, Martin


----------



## Maik (30. Januar 2008)

Alternativ zu diesem Menü kannst du dir ja mal Suckerfish Dropdowns - One Level Bones anschauen, das im IE tadellos funktioniert, obwohl das Dokument im "Standardsmode" übergeben wird.

Falls du gänzlich ohne JS auskommen willst, empfehle ich dir Stu Nicholls' CSS-Dropdown-Menüs (Menus - Definition List & Menus - Multi-Level CSS Only).


----------



## Vetinari (30. Januar 2008)

OK, danke erst mal. Ich schau mir das mal an ...

gruss, Martin


----------

