Hallo miteinander,
ich will einer von mir betriebenen Website (http://sf.gidoo.de) ein neues Lay-out (http://sf.gidoo.de/test) verpassen, habe jedoch noch ein Problem, das außerhalb der Grenzen meines Lateins liegt.
Ich habe Navigationsspalte, deren reduzierter Code wie folgt ausschaut:
<div id="nav"><ul>
<li><div>Grammatik</div><ul>
<li><a href="...">Adjektiv</a><ul>
<li><a href="...">feminine Form</a></li>
<li><a href="...">Stellung</a></li>
</ul></li>
</ul></li>
</ul></div>
Die Untermenüpunkte »feminine Form« und »Stellung« werden rechts des nächst höheren Menüpunktes (»Adjektiv«) angezeigt, sofern sich über diesem die Maus befindet (hover-Effekt).
Die Position der Untermenüpunkte ist - gesehen vom Menüpunkt Adjektiv - um einen Pixel nach links verschoben. Nun möchte ich, dass an der Stelle, wo sich der Menüpunktverweis (a ist hier display:block) und die Untermenüpunkte überlappen, der Rand um das Untermenü nicht angezeigt wird.
Mein Problem sei anhand der folgende Grafik verdeutlicht:

(Die orange Kreise dienen zur Hervorhebung.)
Z-index führte nicht zum gewünschten Erfolg und ich bin momentan etwas ratlos. Ich hoffe, jemand von euch hat eine Idee.
Grüße
Julius