Ich habe hier folgende Navigation (von listmatic), wo sich das Sub-Ul nicht floeten lässt wenn es absolute positioniert wird:
Code:
<html>
<head>
<title>Test</title>
<style type="text/css">
html, body
{
padding: 0;
margin: 0;
}
body
{
color: #FFC000;
background-color: #000000;
font-family: verdana, sans-serif;
font-size: 1em;
}
#navigation
{
width: 100%;
height: 17px;
font-size: 11px;
background-color: #000000;
white-space: nowrap;
position: relative;
padding: 0;
margin: 0;
}
#navigation li
{
float: left;
margin: 0 0 0 2px;
border-width: 1px 1px 0 1px;
border-style: solid;
border-color: #AAAAAA #555555 #FFC000 #999999;
list-style-type: none;
}
#navigation li a
{
width: 90px;
height: 16px;
color: #666666;
border-width: 1px 1px 0 1px;
border-style: solid;
border-color: #CCCCCC;
background-color: #EEEEEE;
text-decoration: none;
text-align: center;
position: relative;
padding: 0 4px;
display: block;
}
#navigation li a:hover
{
text-decoration: underline;
}
#navigation li#active a
{
color: #000000;
font-weight: bold;
border-color: #FFD45F #AA7C22 #694E0A #FFE396;
background-color: #FFC000;
}
#navigation li#active a:hover
{
text-decoration: none;
}
#navigation li#logout
{
float: right;
margin: 0 2px 0 0;
}
#navigation li#logout a
{
color: #000000;
font-weight: bold;
border-color: #FFD45F #AA7C22 #694E0A #FFE396;
background-color: #FFC000;
}
#navigation li#logout a:hover
{
text-decoration: underline;
}
#navigation ul#subnavigation
{
white-space: nowrap;
position: absolute;
top: 20px;
left: 0;
padding: 0;
margin: 0;
}
#navigation ul#subnavigation li
{
border: 0;
margin: 0;
}
#navigation ul#subnavigation li a
{
width: 110px;
color: #000000;
font-weight: normal;
background-color: #EEEEEE;
border: 0;
}
#navigation ul#subnavigation li a:hover
{
text-decoration: underline;
}
#navigation ul#subnavigation li#subactive a
{
background-color: #CCCCCC;
text-decoration: none;
}
#subnavigation_placeholder
{
height: 22px;
font-size: 11px;
background-color: #EEEEEE;
border-top: 3px solid #FFC000;
border-bottom: 3px solid #FFC000;
}
</style>
</head>
<body>
<ul id="navigation">[*]
Startseite
<li id="active">
Gästebuch
<ul id="subnavigation">
<li id="subactive">Eintrag erstellen[*]Einträge bearbeiten[/list]
[*]
Benutzer
[*]
Einstellungen
<li id="logout">Abmelden[/list]
<div id="subnavigation_placeholder"></div>
</body>
</html>
Hat einer von euch eine Idee?