Michel: ul li Menu

SELF-Forum

ul li Menu

Michel
– Informationen zu den Bewertungsregeln

Ich suche schon seit Stunden nach einer Lösung und glaube ich werde langsam blind.

Folgendes Problem:
Ich habe ein verschachteltes ul li ul Menu und wenn die zweite Ebene angezeigt wird, wird diese über die li's der ersten Ebene gelegt, anstatt die li's der ersten Ebene nach unten zu verschieben.

  
<html>  
<head>  
<style>  
* {padding:0;margin:0}  
.nav_menu{width:200px;height:690px;padding-top:40px;float:left;}  
.nav_menu ul{display:block;margin:0;background-color:#fff;position:relative;}  
.nav_menu ul li{height:20px;background:url("tl_files/axxeva.de/img/navline0.png") left bottom no-repeat;text-decoration:none;font-size:12px;line-height:20px;list-style: none;}  
.nav_menu ul li.submenu{font-weight:bold;}  
.nav_menu ul li ul{display:none;margin:0;}  
.nav_menu ul li.active ul,.nav_menu li.trail ul{position:absolute;display:block;}  
.nav_menu ul li.active ul li,.nav_menu ul li.trail ul li,.nav_menu ul li.trail span.active{background-image:none;font-weight:normal;text-decoration:none;}  
.nav_menu ul li.trail ul li,.nav_menu ul li.trail span.active{padding-left:10px;background-image:none;}  
.nav_menu ul li a{padding-left:10px;text-decoration:none;font-size:12px;color:#000;line-height:20px;}  
.nav_menu ul li.active{width:190px;padding-left:10px;background-color:#530A20;text-decoration:none;font-size:12px;color:#fff;line-height:20px;}  
</style>  
</head>  
<body>  
  
<div class="mod_navigation nav_menu block">  
  
<ul class="level_1">  
 <li class="sibling first"><a href="/" class="sibling first">Maintitle 1</a> </li>  
 <li class="active submenu"><span class="active submenu">Submenu 1</span>  
  <ul class="level_2">  
   <li class="first"><a href="#" class="first">Subtitle 1</a></li>  
   <li><a href="#">Subtitle 2</a></li>  
   <li><a href="#">Subtitle 3</a></li>  
   <li><a href="#">Subtitle 4</a></li>  
   <li class="last"><a href="# class="last">Subtitle 5</a></li>  
  </ul>  
 </li>  
 <li class="sibling"><a href="#" class="sibling">Maintitle 2</a></li>  
 <li class="submenu sibling last"><a href="#" class="submenu sibling last">Submenu 2</a>  
  <ul class="level_2">  
   <li class="first"><a href="#" class="first">Subtitle 1</a></li>  
   <li><a href="#">Subtitle 2</a></li>  
   <li><a href="#">Subtitle 3</a></li>  
   <li><a href="#">Subtitle 4</a></li>  
   <li><a href="#">Subtitle 5</a></li>  
   <li class="last"><a href="#" class="last">Subtitle 6</a></li>  
  </ul>  
 </li>  
</ul>  
  
</div>  
  
</body>  
</html>

Ja ich weiss etwas viele class Definationen, doch diese sind größtenteils Standard-Contao-Definationen für ein ul-menu.

Ich danke für jede Hilfe im voraus!

Gruß Michel

Beitrag melden
–
Informationen zu den Bewertungsregeln

  1. ul li Menu

    Der Martin
    – Informationen zu den Bewertungsregeln

    Hallo,

    Ich habe ein verschachteltes ul li ul Menu und wenn die zweite Ebene angezeigt wird, wird diese über die li's der ersten Ebene gelegt, anstatt die li's der ersten Ebene nach unten zu verschieben.

    das ist angesichts der unnötigen absoluten Positionierung nicht anders zu erwarten. Wenn du die Elemente normal im Elementfluss haben willst, solltest du sie nicht daraus herauslösen.

    So long,
     Martin

    --
    Es sagte...
    ein korpulenter Lehrer zu einem Schüler, der ihn ein Fass genannt hatte: "Nein. Ein Fass ist von Reifen umgeben, ich dagegen von Unreifen."
    Selfcode: fo:) ch:{ rl:| br:< n4:( ie:| mo:| va:) de:] zu:) fl:{ ss:) ls:µ js:(
    Beitrag melden
    –
    Informationen zu den Bewertungsregeln

    1. ul li Menu

      Michel
      – Informationen zu den Bewertungsregeln

      Hallo,

      Ich habe ein verschachteltes ul li ul Menu und wenn die zweite Ebene angezeigt wird, wird diese über die li's der ersten Ebene gelegt, anstatt die li's der ersten Ebene nach unten zu verschieben.

      das ist angesichts der unnötigen absoluten Positionierung nicht anders zu erwarten. Wenn du die Elemente normal im Elementfluss haben willst, solltest du sie nicht daraus herauslösen.

      So long,
      Martin

      »»

      Danke Martin habe mal beide Positionierungen entfernt, nun werden die Schriften jedoch direkt über einander gelegt :(

      Menu-Screenshot

      Gruß Michel

      Beitrag melden
      –
      Informationen zu den Bewertungsregeln

      1. ul li Menu

        Michel
        – Informationen zu den Bewertungsregeln

        Bin doch nicht sooo blind .. die Angabe der height im ersten ul li legt mir die Einträge in den Hintergrund! Danke nochmals für die Hilfe!

        Beitrag melden
        –
        Informationen zu den Bewertungsregeln

        1. ul li Menu

          Der Martin
          – Informationen zu den Bewertungsregeln

          Hallo,

          Bin doch nicht sooo blind .. die Angabe der height im ersten ul li legt mir die Einträge in den Hintergrund!

          ah, siehste - das hatte *ich* wiederum übersehen, weil es nicht so die typische Fehlerquelle ist. :-)

          Ciao,
           Martin

          --
          Heutzutage gilt ein Mann schon dann als Gentleman, wenn er wenigstens die Zigarette aus dem Mund nimmt, bevor er eine Frau küsst.
            (Barbra Streisand, US-Schauspielerin)
          Selfcode: fo:) ch:{ rl:| br:< n4:( ie:| mo:| va:) de:] zu:) fl:{ ss:) ls:µ js:(
          Beitrag melden
          –
          Informationen zu den Bewertungsregeln