Dropdown-Menue - Text wird nach unten verschoben

[Doris]

Hallo ihr Spezialisten ,

ich kämpfe schon seit einer Woche mit einem aufklappbaren Menue. Es sieht nun auch so aus, wie ich das gerne hätte.
Leider wird jetzt, wenn das Menue aufklappt, der Inhaltstext der Seite nach unten verschoben. Da hab ich doch irgendwo einen Fehler in meiner CSS-Datei und finde ihn nicht :stinkig::stinkig:

Wär lieb, wenn mal jemand drübergucken könnte

Code:

ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

#nav a {
    font-weight: bold;
    color: #666666;
}

#nav a {
    text-decoration: none;
}

#nav li li a {
    display: block;
    font-weight: normal;
    color: #666666;
    padding: 0.2em 10px;
}

#nav li li a:hover {
    padding: 0.2em 5px;
    border: 5px solid #ffcd37;
    border-width: 0 5px;
}

li {
    float: left;
    position: relative;
    width: 94px;
    text-align: center;
    cursor: default;
    background-color: white;
    border: 1px solid #ffcd37;
    border-width: 1px 0;
}

li#first {
    border-left-width: 1.6em;
}

li#last {
    border-right-width: 1.6em;
}

li ul {
    display: none;
    position: relative;
         font-weight: normal;
    background: #white;
    padding: 0.5em 0 1em 0;
    border-right: solid 1px #ffcd37;
         border-left: solid 1px #ffcd37;
}

li>ul {
    top: auto;
    left: auto;
}

li li {
    display: block;
    float: none;
    background-color: transparent;
    border: 0;
}

li:hover ul, li.over ul {
    display: block;
}

Das Javascript dazu:

startList = function() {
if (document.all&&document.getElementById) {
navRoot = document.getElementById("nav");
for (i=0; i<navRoot.childNodes.length; i++) {
node = navRoot.childNodes[i];
if (node.nodeName=="LI") {
node.onmouseover=function() {
this.className+=" over";
}
node.onmouseout=function() {
this.className=this.className.replace(" over", "");
}
}
}
}
}
window.onload=startList;

Liebe Grüße
Doris