Dropdownmenü soll untere Menüpunkte verdrängen

[nicole]

Hi Leute.
Hoffe jemand hat ne Idee.

Habe auf der Seite:

http://www.lunaticsol.de/css_dropdown/Dropdown.htm

ein Dropdownmenü mit Listenelementen und Css erstellen wollen.
Soweit klappt alles recht gut (mit der Hilfe von selfhtml.org),
aber bei dem Menüpunkt DU erscheint ja ein Dropdownmenü,
welches über diese Listenelemente funktioniert.

Meinen CSS code findet ihr ganz unten in diesem Eintrag.

Nun habe ich ein paar Fragen:
1)
Jetzt möchte ich gern, dass diese Untermenüelemente die
Hauptmenüelemente darunter verdrängt (also weiter nach unten verschiebt und beim Schließen wieder hochrutschen lässt).
Ist das mit Css möglich?
2)
Wie würde ich es schaffen, dass das Untermenü links von dem Menüpunkt Du erscheint?
3)
Wie kann ich den InternetExplorer dazu bringen, zwischen den Hauptmenübuttons auch Abstände einzufügen, genau wie beim Mozilla??

Danke schon mal für eure Hilfe!!
Grüße
Nicole

_________________________________________
CSS Code::::::

  
body {  
    font: normal 80% Helvetica, Arial, sans-serif;  
    color: #255f9b;  
  }  
  
  h1 {  
  font: normal 80% Helvetica, Arial, sans-serif;  
    color: #255f9b;  
  }  
  
  div#Rahmen {  
    width: 300px;  
 height: 600px;  
    padding: 5px;  
    background-color: #ccddef;  
  }  
  * html div#Rahmen {  /* Korrektur fuer IE 5.x */  
    width: 300px;  
  
  
 /* w\idth: 47.1em; */  
  
  }  
  div#Rahmen div {  
     clear: left;  
  }  
  ul#Navigation {  
    margin: 0; padding: 0;  
    text-align: left;  
  }  
  
  ul#Navigation li {  
    list-style: none;  
    float: left;  /* ohne width - nach CSS 2.1 erlaubt */  
    position: relative;  
    margin: 0.4em; padding: 0;  
 clear: both;  
  }  
  * html ul#Navigation li {  /* Korrektur fuer den IE 5 und 6 */  
    margin-bottom: -0.4em;  
  }  
  *:first-child+html ul#Navigation li {  /* Korrektur fuer den IE 7 */  
    margin-bottom: -0.1em;  
  }  
  
  ul#Navigation li ul {  
    margin: 0; padding: 0;  
    position: absolute;  
    top: 1.6em; left: -0.4em;  
    display: none;  /* Unternavigation ausblenden */  
  }  
  
  * html ul#Navigation li ul {  /* Korrektur fuer IE 5.x */  
    left: -1.5em;  
    lef\t: -0.4em;  
  }  
  *:first-child+html ul#Navigation ul {  /* Workaround fuer den IE 7 */  
    background-color:#255f9b; padding-bottom:0.4em;  
  }  
  ul#Navigation li:hover ul {  
    display: block;  /* Unternavigation in modernen Browsern einblenden */  
  }  
  ul#Navigation li ul li {  
    float: none;  
    display: block;  
    margin-bottom: 0.2em;  
  }  
  
  ul#Navigation a, ul#Navigation span {  
    display: block;  
    width: 8.4em;  /* Breite den in li enthaltenen Elementen zuweisen */  
    padding: 0.2em 1em;  
    text-decoration: none; font-weight: bold;  
    border: 1px solid black;  
    border-left-color: white; border-top-color: white;  
    color: #000066; background-color: #255f9b;  
  }  
  * html ul#Navigation a, * html ul#Navigation span {  
    width: 8.6em;   /* Breite nach altem MS-Boxmodell für IE 5.x */  
    w\idth: 6.4em;  /* korrekte Breite fuer den IE 6 im standardkonformen Modus */  
  }  
  ul#Navigation a:hover, ul#Navigation span, li a#aktuell {  
    border-color: white;  
    border-left-color: black; border-top-color: black;  
    color: white; background-color: #255f9b;  
  
  }  
  li a#aktuell {  /* aktuelle Rubrik kennzeichnen */  
    color: #000066; background-color: #255f9b;  
  }  
  ul#Navigation li ul span {  /* aktuelle Unterseite kennzeichnen */  
    background-color: #000066;  
  }