Enrico: Horiz. DropDown-Menü, Aufbau nur über css

Beitrag lesen

Hallo Jankins,

vielen Dank für Deine Rückantwort.

Mit Deinem Hinweis und folgenden css-Definitionen habe ich jetzt die
Oberpunkte horizontal, die Unterpunkte vertikal:

<html>
 <head>
  <style type="text/css">

ul
   {
    list-style: none;
    margin:  0px;
    padding: 0px;
    width:auto;
   }

li
   {
    position:relative;
   }

ul li
   {
    float:left;
    padding-right: 7px;
   }

ul li ul
   {
    display: none;
   }

ul li:hover ul
   {
    display: block;
   }

ul li ul li
   {
    clear:both;
    float:left;
   }

</style>
 </head>
 <body>
  <ul>
   <li>Anfangsbuchstabe
    <ul>
     <li>C</li>
     <li>G</li>
    </ul>
   </li>
   <li>Genre
    <ul>
     <li>Action / Drama</li>
     <li>Horror</li>
    </ul>
   </li>
   <li>FSK
    <ul>
     <li>16</li>
     <li>18</li>
    </ul>
   </li>
   <li>Darsteller
    <ul>
     <li>BULLOCK, Sandra</li>
     <li>REEVES, Keanu</li>
    </ul>
   </li>
   <li>Produzent
    <ul>
     <li>BRUCKHEIMER, Jerry</li>
     <li>SILVER, Joel</li>
    </ul>
   </li>
  </ul>
 </body>
</html>

Wie bekomme ich es jetzt noch hin, dass die Oberpunkte beim Anzeigen der jeweiligen
Unterpunkte nicht auseinandergezogen werden, wenn die Unterpunkte "breiter" sind als
die Oberpunkte bzw. beim Verbergen des jeweiligen Menüs wieder zusammengeschoben werden?

Beispiel zur Verdeutlichung:

Ausgangszustand:

+----------------+ +-----+ +---+ +----------+ +---------+
|Anfangsbuchstabe| |Genre| |FSK| |Darsteller| |Produzent|
+----------------+ +-----+ +---+ +----------+ +---------+

hover am Menüpunkt "Genre":

+----------------+ +-----+          +---+ +----------+ +---------+
|Anfangsbuchstabe| |Genre|          |FSK| |Darsteller| |Produzent|
+----------------+ +--------------+ +---+ +----------+ +---------+
                   |Action / Drama|
                   |Drama         |
                   +--------------+

hover am Menüpunkt "Darsteller":

+----------------+ +-----+ +---+ +----------+      +---------+
|Anfangsbuchstabe| |Genre| |FSK| |Darsteller|      |Produzent|
+----------------+ +-----+ +---+ +---------------+ +---------+
                                 |BULLOCK, Sandra|
                                 |REEVES, Keanu  |
                                 +---------------+

Ich möchte (und kann) nicht mit festen Breiten arbeiten, da diese nicht feststehen oder
ausgelesen werden können.

Ich möchte erreichen, dass die Oberpunkte immer, wie im Ausgangszustand, stehen bleiben und
nur die Unterpunkte, ihrer Breite etsprechend und ohne Zeilenumbruch, angezeigt werden.

Kannst Du mir auch nochmal weiterhelfen?

Vorab nochmals Danke hierfür.

Gruß
Enrico