#navigation li { float: left; position: relative; } .niveau1 { font-size: 12px; } .niveau1 a { padding: 4px 8px 8px 8px; text-decoration: none; color: #fff; display: block; } .niveau1 a:hover { color: #fff; background-color: #f93; } .ulniveau2 { display: none; width: 12em; position: absolute; top: 24px; left: 0px; z-index: 1000; font-size: 11px; background-color:#ff9933 } .niveau2 { width: 100%; } .niveau2 a { text-decoration: none; padding: 4px 6px; margin: 0; display: block; background-color: #ff9933; } .niveau2 a:hover { background-color: #fff; color:#ff9933; font-weight:bold; } /*#navigation li>ul { to override top and left in browsers other than IE, which will position to the top right of the containing li, rather than bottom left top: auto; left: auto; }*/ #navigation li:hover ul, li.over ul { /* lists nested under hovered list items */ display: block; }