Ralf: CSS Navi Vertikal mit Abstand

Hallo,

nutze folgenden CSS Code:
#vpnavigation, #vpnavigation ul { /* alle Listen */
  padding: 0;
  margin: 0;
  list-style: none;
  width : 140px;
}

#vpnavigation li { /* alle Listenelemente */
  position : relative;
  line-height : 19px;
  margin-bottom : -1px;
  width: 140px;
}

#vpnavigation li ul { /* Listen 2. Ebene */
  position : absolute;
  left: -999em;
  margin-left : 150px;
  margin-top : -20px;
  padding-left: 2px;
}

#vpnavigation li ul ul { /* Listen 3. Ebene und weiter */
  left: -999em;
}

#vpnavigation a {
  width: 140px;
  w\idth : 137px;
  display : block;
  height: 19px;
  color : #252070;
  font-size: 12px;
  font-weight : bold;
  text-decoration : none;
  background-color : #CCCCFF;
  padding : 0 0.5em;
  margin-bottom: 2px;
}

#vpnavigation a:hover {
  color: #cc6600;
}

#vpnavigation li:hover ul ul, #vpnavigation li.sfhover ul ul {
  left: -999em;
}

#vpnavigation li:hover ul, #vpnavigation li li:hover ul, #vpnavigation li.sfhover ul, #vpnavigation li li.sfhover ul { /* Listen, die unterhalb von "gehoverten" Menüpunkte liegen */
  left: auto;
}

#vpnavigation li li a.daddy { /* Listenelemente mit Unterpunkten */
}

#vpnavigation li#active { /* Listen zur aktuellen Kategorie */
}

Ich habe einen kleinen Abstand zwischen den einzelnen Unterpunkten. Wenn man nicht schnell genug mit der Maus nach rechts zieht verschwindet das Untermenu - wie kann ich das verhindern?

DANKE

  1. Hi,

    left: -999em;
      margin-left : 150px;
      margin-top : -20px;

    warum die negativen Werte? Zum Ausblenden ist display:none besser geeignet und ein negatives margin ist immer nur eine problematische Notlösung.

    padding : 0 0.5em;

    schön, dass Du wenigstens hier em verwendest. Aber diese Mixtur beschert Dir auch Probleme beim Berechnen der Boxbreiten in standardkonformen Browsern.

    Ich habe einen kleinen Abstand zwischen den einzelnen Unterpunkten. Wenn man nicht schnell genug mit der Maus nach rechts zieht verschwindet das Untermenu - wie kann ich das verhindern?

    wähle geeignete Werte. Färbe hierzu den Boxgintergrund ein, um eine minimale Überlappung zu erreichen und auch zu sehen.

    freundliche Grüße
    Ingo