Ausklapp Menü

[Semtax]

Hallo Leute,

Ich hab ein kleines Problem mit mein ausklappbares Menü vom Submenü wird komischerweise nur 2 Eintrage angezeigt habe aber keine Idee wodran das liegen könnte.

    <div id="menu">
        <ul class="topmenu">
            <li class="hassub">
                <a href="#">Managers</a>
                <ul class="submenu">
                    <li><a href="#">Href #1</a></li>
                    <li><a href="#">Href #2</a></li>
                    <li><a href="#">Href #3</a></li>
                </ul>
            </li>
            <li class="hassub">
                <a href="#">Editoren</a>
                <ul class="submenu">
                    <li><a href="#">Href #1</a></li>
                    <li><a href="#">Href #2</a></li>
                    <li><a href="#">Href #3</a></li>
                    <li><a href="#">Href #4</a></li>
                </ul>
            </li>
        </ul><div style="clear: both;"></div>
    </div>

[css]
#container #menu {
background-color: #B4ABAB;
border: 1px solid black;
height: 50px;
display: table;
width: 100%;
}


#container #page {
background-color: #B4ABAB;
border: 1px solid black;
border-top: 0px;
padding: 10px;
}


#container #menu .topmenu li {
float: left;
padding: 13px 10px;
margin-right: 10px;
background-color: #9C9A9A;
border-left: 1px solid black;
border-right: 1px solid black;
list-style: none;
height: 24px;
width: 150px;
}


#container #menu .topmenu .submenu {
padding: 0;
margin: 0;
display: none;
}


#container #menu .topmenu .submenu li {
border-bottom: 1px solid black;
}


#container #menu .topmenu .hassub:hover .submenu {
margin-left: -11px;
margin-top: 17px;
display: block;
z-index: 500;
}
[/css]

Gruß
Semtax

 

[Timmer]

Spontan würde ich sagen, es liegt an der fest gesetzten Höhe von #menu.

Übrigens: Da IDs nur einmal im Dokument vergeben werden dürfen, sind deine verketteten CSS Selects wie '#container #menu' unnötig, es reicht '#menu'. Sollen mehrere Menüs auf der Seite erscheinen, nutze unterschiedliche IDs oder Klassen.

 

[Banana_Jones]

Übrigens: Da IDs nur einmal im Dokument vergeben werden dürfen, sind deine verketteten CSS Selects wie '#container #menu' unnötig, es reicht '#menu'. Sollen mehrere Menüs auf der Seite erscheinen, nutze unterschiedliche IDs oder Klassen.

Naja, wenn er jetzt auf einer (anderen) Unterseite ein #menu hat, dass nicht in #container liegt, ist das schon sinnvoll. Ich könnte mir Use-cases vorstellen bei denen ein #menu auf unterschiedlichen Seiten in #links oder #rechts liegen kann (nicht gleichzeitig natürlich).

 

[Timmer]

Naja, wenn er jetzt auf einer (anderen) Unterseite ein #menu hat, dass nicht in #container liegt, ist das schon sinnvoll. Ich könnte mir Use-cases vorstellen bei denen ein #menu auf unterschiedlichen Seiten in #links oder #rechts liegen kann (nicht gleichzeitig natürlich).

Ich erinnere mich, mal gelesen zu haben, dass einige Browser das garnicht mögen. Sie setzen es zwar um, trotzdem ist es schlecht. Außerdem ist das sinnlos, solange die Menüs (oder Subelemente) nicht mindestens eine Anweisung gemeinsam haben, welche über den Selektor '#menu' zugewiesen wurde. Wenn er immer den kompletten Selektor-"Pfad" (ich nenn das jetzt mal so) angibt, reichen Klassen ;)