hallo,
ich hab ein problem mit meinem top navi:
wie ihr sehn könnt ist verschieben sich die oberen elemente wenn man mit der maus drüber fährt um die unter menüs anzuzeigen.
wie kann ich es so machen das sich die oberen menüs nicht verschieben ?
html code ist ein einfaches ul li system.
css code:
Code
ul#Navigation {
margin: 0;
padding: 0;
text-align: center;
}
ul#Navigation li {
list-style: none;
float: left; /* ohne width - nach CSS 2.1 erlaubt */
position: relative;
margin-top: 30px;
padding: 0;
}
ul#Navigation li ul {
float: left;
margin-top: 5px;
padding: 0;
position: relative;
display: none; /* Unternavigation ausblenden */
}
ul#Navigation li:hover ul {
display: block; /* Unternavigation in modernen Browsern einblenden */
}
ul#Navigation li ul li {
float: left;
display: block;
}
ul#Navigation a {
display: block;
width: 100px; /* Breite den in li enthaltenen Elementen zuweisen */
padding: 3px;
text-decoration: none;
font-weight: bold;
border: 1px solid black;
border-left-color: white;
border-top-color: white;
color: maroon;
background-color: #ccc;
}
ul#Navigation li ul a {
list-style: none;
float: left;
display: block;
width: 60px; /* Breite den in li enthaltenen Elementen zuweisen */
padding: 3px;
text-decoration: none;
font-size: small;
font-weight: bold;
border: 1px solid black;
border-left-color: white;
border-top-color: white;
color: maroon;
background-color: #ccc;
}