✔ Drop Down Menü

[SexontheBeach]

Wie mach ich das ?

 

[Nord-Süd-Richtung]

Hi

ersteinmal könntest du ein bisschen Eigeninitiative zeigen und selber suchen. Wenn du nicht weißt wie: Klick mich

 

[SexontheBeach]

Ehm das sind keine mehren Div's sondern tabele plus div

 

[Nord-Süd-Richtung]

Hi

Du solltest Tabellen nur dafür verwenden wozu sie gedacht sind und nicht um damit ein Layout zu entwerfen
Dafür eignet sich besser:

<div style="position:absolute; margin-left: 100px; margin-top: 25px;width:600px; height:200px;">Header</div>
<div style="position:absolute; margin-left: 100px; margin-top: 225px;width:200px; height:400px;">Navi</div>
<div style="position:absolute; margin-left: 300px; margin-top: 225px;width:300px; height:400px;">Content</div>

 

[Maik]

Danke Maik.

Das DropDown Menü zerreist das Menü
http://oliver.w.idoo.com/test/

Was habe ich da falsch gemacht?

Das Dropdownmenü muß mit einer absoluten Positionierung aus dem normalen Textfluß genommen werden, damit beim Öffnen der Submenüs der nachfolgende Seiteninhalt nicht nach unten verschoben wird.

Damit sich hier die absolute Positionierung nicht "standardmäßig" auf den Rand des Browserfensters, sondern auf die umschliessende Tabellenzelle bezieht, wird das Menü in einen relativ positionierten DIV-Block eingebettet:

<div id="menu">
      <ul id="nav">
          ...
      </ul>
</div>

#menu {
position:relative;
}
#nav {
position:absolute;
}

mfg Maik

 

[SexontheBeach]

Danke Maike ;-)
Sehr nett von dir das du mir hilfst ;-)

Ich habe das jetzt gemacht jetzt hängt das Menü leider runter..

http://oliver.w.idoo.com/test

 

[Maik]

Moin,

hier ist noch eine kleine Korrekturmaßnahme vorzunehmen:

td {
vertical-align:top; /* Zellinhalt oben ausrichten */
}

#nav {
position:absolute;
top:2px; /* Startposition von oben */
}

mfg Maik

 

[SexontheBeach]

Mhm..

Dann sieht das so aus: http://oliver.w.idoo.com/test/

 

[Maik]

Das kommt dabei heraus, weil du meine Erläuterung von gestern Abend nicht vollständig in deinem Code umgesetzt hast.

Im HTML-Code fehlt der angesprochene DIV-Block #menu, in dem das Menü eingebettet wird, womit die dazugehörige CSS-Regel zur relativen Positionierung derzeit wirkungslos bleibt.

mfg Maik

 

[SexontheBeach]

Das kommt dabei heraus, weil du meine Erläuterung von gestern Abend nicht vollständig in deinem Code umgesetzt hast.

Im HTML-Code fehlt der angesprochene DIV-Block #menu, in dem das Menü eingebettet wird, womit die dazugehörige CSS-Regel zur relativen Positionierung derzeit wirkungslos bleibt.

mfg Maik

Da komm ich nicht ganz mit.
Was soll ich wo einbauen bzw ändern ?