Einzelnen Beitrag anzeigen
  #1 (permalink)  
Alt 15.09.2005, 08:39
eRoZion eRoZion ist offline
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 09.11.2004
Beiträge: 61
eRoZion befindet sich auf einem aufstrebenden Ast
Standard Ul mit Sub-Ul Navigation macht Darstellungsprobleme im Opera

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&auml;stebuch
  
    <ul id="subnavigation">
     <li id="subactive">Eintrag erstellen[*]Eintr&auml;ge bearbeiten[/list]   
 [*]
    Benutzer
   
 [*]
    Einstellungen
   
 
   <li id="logout">Abmelden[/list]
  <div id="subnavigation_placeholder"></div>
 </body>
</html>
Hat einer von euch eine Idee?
Mit Zitat antworten
Sponsored Links