menu via css oder ähnlichem erstellen

hallo zusammen,

ich versuche nun meine webseite ein wenig zu überarbeiten.

http://ttc-tobi.bplaced.net/neues_design.php
ein hoizontales menü ist eingebaut, nur stellt sich mir jetzt die frage wie ich untermenüs realisieren kann.

gibts es irgendwo vorlagen die man sich zu gemüte führen kann, oder hilfreiche informationen, die expliciet solche menus betreffen?

bzw ne kleien scriptvorlage

mfg tobsp

Wenn das Menu auch ohne Javascript gehen soll, dann ist http://htmldog.com/articles/suckerfish/dropdowns/ ein guter Anfang.

unter http://pixopoint.com/suckerfish_css/ gibt es auch einen Generator mit unzähligen Optionen

sorry für den doppelpost, wie oben schon geschrieben, habe ich ein menu gefunden und auch proboert einzubauen, leider komme ich im moment nicht weiter.
http://ttc-tobi.bplaced.net/neues_design_1/

- der ie 6 zeigt mir bei sonstiges kein untermenu an
- das untermenu von turnier ebereitet mir probleme, da tauchen die unterpunke hintereinander auf
- das untermenu von jugendn hat bei veranstaltungen oder mannschafen zum jeweilen weiteren untermenu einen zu weiten abstand.das gleiche problem hab ich auch bei 1950 bis heute

hier mal der css code und der menu code:

.preload2 {background: url(grafiken_navi/button4.gif);}
.menu2 {padding:0 0 0 4px; margin:0; list-style:none; height:35px; background:#fff url(grafiken_navi/button1a.gif) repeat-x; position:relative; font-family:arial; }
.menu2 li.top {display:block; float:left; position:relative;}
.menu2 li a.top_link {display:block; float:left; height:40px; line-height:33px; color:#bbb; text-decoration:none; font-size:12px; font-weight:bold; padding:0 0 0 9px; cursor:pointer;}
.menu2 li a.top_link span {float:left; display:block; padding:0 17px 0 12px; height:40px;}
.menu2 li a.top_link span.down {float:left; display:block; padding:0 24px 0 12px; height:40px; background:url(grafiken_navi/down.gif) no-repeat right top;}
.menu2 li a.top_link:hover {color:#fff; background: url(grafiken_navi/button4.gif) no-repeat;}
.menu2 li a.top_link:hover span {background:url(grafiken_navi/button4.gif) no-repeat right top;}
.menu2 li a.top_link:hover span.down {background:url(grafiken_navi/button4a.gif) no-repeat right top;}

.menu2 li:hover > a.top_link {color:#fff; background: url(grafiken_navi/button4.gif) no-repeat;}
.menu2 li:hover > a.top_link span {background:url(grafiken_navi/button4.gif) no-repeat right top;}
.menu2 li:hover > a.top_link span.down {background:url(grafiken_navi/button4a.gif) no-repeat right top;}


.menu2 table {border-collapse:collapse; width:0; height:0; position:absolute; top:0; left:0;}

/* Default link styling */

/* Style the list OR link hover. Depends on which browser is used */

.menu2 a:hover {visibility:visible;}
.menu2 li:hover {position:relative; z-index:200;}

/* keep the 'next' level invisible by placing it off screen. */
.menu2 ul,
.menu2 :hover ul ul,
.menu2 :hover ul :hover ul ul,
.menu2 :hover ul :hover ul :hover ul ul,
.menu2 :hover ul :hover ul :hover ul :hover ul ul {position:absolute; left:-9999px; top:-9999px; width:0; height:0; margin:0; padding:0; list-style:none;}

.menu2 :hover ul.sub_mannschaften {left:2px; top:35px; background: #fff; padding:3px 0; border:1px solid #4ab; white-space:nowrap; width:83px; height:auto;}
.menu2 :hover ul.sub_mannschaften li {display:block; height:20px; position:relative; float:left; width:90px;}
.menu2 :hover ul.sub_mannschaften li a {display:block; font-size:14px; height:20px; width:77px; line-height:20px; text-indent:5px; color:#000; text-decoration:none; border:3px solid #fff; border-width:0 0 0 3px;}
.menu2 :hover ul.sub_mannschaften li a.fly {background:#fff url(grafiken_navi/arrow.gif) 80px 7px no-repeat;}
.menu2 :hover ul.sub_mannschaften li a:hover {background:#4ab; color:#fff;}
.menu2 :hover ul.sub_mannschaften li a.fly:hover {background:#4ab url(grafiken_navi/arrow_over.gif) 80px 7px no-repeat; color:#fff;}
.menu2 :hover ul li:hover > a.fly {background:#4ab url(grafiken_navi/arrow_over.gif) 80px 7px no-repeat; color:#fff;}

.menu2 :hover ul.sub_turniere {left:2px; top:35px; background: #fff; padding:3px 0; border:1px solid #4ab; white-space:nowrap; width:190px; height:auto;}
.menu2 :hover ul.sub_turniere li {display:block; height:20px; position:relative; float:left; width:90px;}
.menu2 :hover ul.sub_turniere li a {display:block; font-size:14px; height:20px; width:184px; line-height:20px; text-indent:5px; color:#000; text-decoration:none; border:3px solid #fff; border-width:0 0 0 3px;}
.menu2 :hover ul.sub_turniere li a.fly {background:#fff url(grafiken_navi/arrow.gif) 178px 7px no-repeat;}
.menu2 :hover ul.sub_turniere li a:hover {background:#4ab; color:#fff;}
.menu2 :hover ul.sub_turniere li a.fly:hover {background:#4ab url(grafiken_navi/arrow_over.gif) 178px 7px no-repeat; color:#fff;}
.menu2 :hover ul li:hover > a.fly {background:#4ab url(grafiken_navi/arrow_over.gif) 80px 7px no-repeat; color:#fff;}

.menu2 :hover ul.sub_jugend {left:2px; top:35px; background: #fff; padding:3px 0; border:1px solid #4ab; white-space:nowrap; width:150px; height:auto;}
.menu2 :hover ul.sub_jugend li {display:block; height:20px; position:relative; float:left; width:90px;}
.menu2 :hover ul.sub_jugend li a {display:block; font-size:14px; height:20px; width:144px; line-height:20px; text-indent:5px; color:#000; text-decoration:none; border:3px solid #fff; border-width:0 0 0 3px;}
.menu2 :hover ul.sub_jugend li a.fly {background:#fff url(grafiken_navi/arrow.gif) 133px 7px no-repeat;}
.menu2 :hover ul.sub_jugend li a:hover {background:#4ab; color:#fff;}
.menu2 :hover ul.sub_jugend li a.fly:hover {background:#4ab url(grafiken_navi/arrow_over.gif) 133px 7px no-repeat; color:#fff;}
.menu2 :hover ul li:hover > a.fly {background:#4ab url(grafiken_navi/arrow_over.gif) 80px 7px no-repeat; color:#fff;}


.menu2 :hover ul.sub_termine {left:2px; top:35px; background: #fff; padding:3px 0; border:1px solid #4ab; white-space:nowrap; width:109px; height:auto;}
.menu2 :hover ul.sub_termine li {display:block; height:20px; position:relative; float:left; width:90px;}
.menu2 :hover ul.sub_termine li a {display:block; font-size:14px; height:20px; width:103px; line-height:20px; text-indent:5px; color:#000; text-decoration:none; border:3px solid #fff; border-width:0 0 0 3px;}
.menu2 :hover ul.sub_termine li a.fly {background:#fff url(grafiken_navi/arrow.gif) 80px 7px no-repeat;}
.menu2 :hover ul.sub_termine li a:hover {background:#4ab; color:#fff;}
.menu2 :hover ul.sub_termine li a.fly:hover {background:#4ab url(grafiken_navi/arrow_over.gif) 80px 7px no-repeat; color:#fff;}
.menu2 :hover ul li:hover > a.fly {background:#4ab url(grafiken_navi/arrow_over.gif) 80px 7px no-repeat; color:#fff;}

.menu2 :hover ul.sub_presse {left:2px; top:35px; background: #fff; padding:3px 0; border:1px solid #4ab; white-space:nowrap; width:64px; height:auto;}
.menu2 :hover ul.sub_presse li {display:block; height:20px; position:relative; float:left; width:90px;}
.menu2 :hover ul.sub_presse li a {display:block; font-size:14px; height:20px; width:58px; line-height:20px; text-indent:5px; color:#000; text-decoration:none; border:3px solid #fff; border-width:0 0 0 3px;}
.menu2 :hover ul.sub_presse li a.fly {background:#fff url(grafiken_navi/arrow.gif) 80px 7px no-repeat;}
.menu2 :hover ul.sub_presse li a:hover {background:#4ab; color:#fff;}
.menu2 :hover ul.sub_presse li a.fly:hover {background:#4ab url(grafiken_navi/arrow_over.gif) 80px 7px no-repeat; color:#fff;}
.menu2 :hover ul li:hover > a.fly {background:#4ab url(grafiken_navi/arrow_over.gif) 80px 7px no-repeat; color:#fff;}

.menu2 :hover ul.sub {left:2px; top:35px; background: #fff; padding:3px 0; border:1px solid #4ab; white-space:nowrap; width:auto; height:auto;}
.menu2 :hover ul.sub li {display:block; height:20px; position:relative; float:left; width:auto;}
.menu2 :hover ul.sub li a {display:block; font-size:14px; height:20px; width:auto; line-height:20px; text-indent:5px; color:#000; text-decoration:none; border:3px solid #fff; border-width:0 0 0 3px;}
.menu2 :hover ul.sub li a.fly {background:#fff url(grafiken_navi/arrow.gif) 80px 7px no-repeat;}
.menu2 :hover ul.sub li a:hover {background:#4ab; color:#fff;}
.menu2 :hover ul.sub li a.fly:hover {background:#4ab url(grafiken_navi/arrow_over.gif) 80px 7px no-repeat; color:#fff;}
.menu2 :hover ul li:hover > a.fly {background:#4ab url(grafiken_navi/arrow_over.gif) 80px 7px no-repeat; color:#fff;}

.menu2 :hover ul.sub_1950bisheute {left:2px; top:35px; background: #fff; padding:3px 0; border:1px solid #4ab; white-space:nowrap; width:136px; height:auto;}
.menu2 :hover ul.sub_1950bisheute li {display:block; height:20px; position:relative; float:left; width:90px;}
.menu2 :hover ul.sub_1950bisheute li a {display:block; font-size:14px; height:20px; width:130px; line-height:20px; text-indent:5px; color:#000; text-decoration:none; border:3px solid #fff; border-width:0 0 0 3px;}
.menu2 :hover ul.sub_1950bisheute li a.fly {background:#fff url(grafiken_navi/arrow.gif) 120px 7px no-repeat;}
.menu2 :hover ul.sub_1950bisheute li a:hover {background:#4ab; color:#fff;}
.menu2 :hover ul.sub_1950bisheute li a.fly:hover {background:#4ab url(grafiken_navi/arrow_over.gif) 120px 7px no-repeat; color:#fff;}
.menu2 :hover ul li:hover > a.fly {background:#4ab url(grafiken_navi/arrow_over.gif) 80px 7px no-repeat; color:#fff;}

.menu2 :hover ul.sub_aktivitaeten {left:2px; top:35px; background: #fff; padding:3px 0; border:1px solid #4ab; white-space:nowrap; width:167px; height:auto;}
.menu2 :hover ul.sub_aktivitaeten li {display:block; height:20px; position:relative; float:left; width:90px;}
.menu2 :hover ul.sub_aktivitaeten li a {display:block; font-size:14px; height:20px; width:161px; line-height:20px; text-indent:5px; color:#000; text-decoration:none; border:3px solid #fff; border-width:0 0 0 3px;}
.menu2 :hover ul.sub_aktivitaeten li a.fly {background:#fff url(grafiken_navi/arrow.gif) 80px 7px no-repeat;}
.menu2 :hover ul.sub_aktivitaeten li a:hover {background:#4ab; color:#fff;}
.menu2 :hover ul.sub_aktivitaeten li a.fly:hover {background:#4ab url(grafiken_navi/arrow_over.gif) 80px 7px no-repeat; color:#fff;}
.menu2 :hover ul li:hover > a.fly {background:#4ab url(grafiken_navi/arrow_over.gif) 80px 7px no-repeat; color:#fff;}

.menu2 :hover ul.sub_verein {left:2px; top:35px; background: #fff; padding:3px 0; border:1px solid #4ab; white-space:nowrap; width:122px; height:auto;}
.menu2 :hover ul.sub_verein li {display:block; height:20px; position:relative; float:left; width:90px;}
.menu2 :hover ul.sub_verein li a {display:block; font-size:14px; height:20px; width:116px; line-height:20px; text-indent:5px; color:#000; text-decoration:none; border:3px solid #fff; border-width:0 0 0 3px;}
.menu2 :hover ul.sub_verein li a.fly {background:#fff url(grafiken_navi/arrow.gif) 80px 7px no-repeat;}
.menu2 :hover ul.sub_verein li a:hover {background:#4ab; color:#fff;}
.menu2 :hover ul.sub_verein li a.fly:hover {background:#4ab url(grafiken_navi/arrow_over.gif) 80px 7px no-repeat; color:#fff;}
.menu2 :hover ul li:hover > a.fly {background:#4ab url(grafiken_navi/arrow_over.gif) 80px 7px no-repeat; color:#fff;}

.menu2 :hover ul.sub_sonstiges {left:2px; top:35px; background: #fff; padding:3px 0; border:1px solid #4ab; white-space:nowrap; width:95px; height:auto;}
.menu2 :hover ul.sub_sonstiges li {display:block; height:20px; position:relative; float:left; width:90px;}
.menu2 :hover ul.sub_sonstiges li a {display:block; font-size:14px; height:20px; width:89px; line-height:20px; text-indent:5px; color:#000; text-decoration:none; border:3px solid #fff; border-width:0 0 0 3px;}
.menu2 :hover ul.sub_sonstiges li a.fly {background:#fff url(grafiken_navi/arrow.gif) 80px 7px no-repeat;}
.menu2 :hover ul.sub_sonstiges li a:hover {background:#4ab; color:#fff;}
.menu2 :hover ul.sub_sonstiges li a.fly:hover {background:#4ab url(grafiken_navi/arrow_over.gif) 80px 7px no-repeat; color:#fff;}
.menu2 :hover ul li:hover > a.fly {background:#4ab url(grafiken_navi/arrow_over.gif) 80px 7px no-repeat; color:#fff;}

.menu2 :hover ul :hover ul,
.menu2 :hover ul :hover ul :hover ul,
.menu2 :hover ul :hover ul :hover ul :hover ul,
.menu2 :hover ul :hover ul :hover ul :hover ul :hover ul
{left:190px; top:-4px; background: #fff; padding:3px 0; border:1px solid #4ab; white-space:nowrap; width:93px; z-index:200; height:auto;}

<span class="preload2"></span>

<ul class="menu2">

        <li class="top"><a href="index.php" id="mannschaften" class="top_link"><span class="down">MANNSCHAFTEN</span><!--[if gte IE 7]><!--></a><!--<![endif]-->
                <!--[if lte IE 6]><table><tr><td><![endif]-->
                <ul class="sub_mannschaften">
                        <li><a href="damen1.php">Damen 1</a></li>
                        <li><a href="damen2.php">Damen 2</a></li>
                        <li><a href="herren1.php">Herren 1</a></li>
                        <li><a href="herren2.php">Herren 2</a></li>
                        <li><a href="herren3.php">Herren 3</a></li>
                        <li><a href="herren4.php">Herren 4</a></li>
                        <li><a href="herren5.php">Herren 5</a></li>
                        <li><a href="herren6.php">Herren 6</a></li>
                        <li><a href="jugend.php">Jugend</a></li>
                        <li><a href="schuelerA.php">Sch&uuml;ler A</a></li>
                </ul>
                <!--[if lte IE 6]></td></tr></table></a><![endif]-->
        </li>

        <li class="top"><a href="index.php" id="turniere" class="top_link"><span class="down">TURNIERE</span><!--[if gte IE 7]><!--></a><!--<![endif]-->
                <!--[if lte IE 6]><table><tr><td><![endif]-->
                <ul class="sub_turniere">
                        <li><a href="index.php" class="fly">Ping-Pong-Caf&eacute;<!--[if gte IE 7]><!--></a><!--<![endif]-->
                                        <!--[if lte IE 6]><table><tr><td><![endif]-->
                                        <ul>
                                                <li><a href="ppc2009.php/">2009</a></li>
                                                <li><a href="index.php" class="fly">2010<!--[if gte IE 7]><!--></a><!--<![endif]-->
                                                        <!--[if lte IE 6]><table><tr><td><![endif]-->
                                                        <ul>
                                                                <li><a href="ppc2010.php">2010</a></li>
                                                        </ul>
                                                        <!--[if lte IE 6]></td></tr></table></a><![endif]-->
                                                </li>
                                                <li><a href="ppcArchiv">Archiv</a></li>
                                        </ul>
                                        <!--[if lte IE 6]></td></tr></table></a><![endif]-->
                        </li>
                        <li><a href="index.php" class="fly">Karlsbad Cup<!--[if gte IE 7]><!--></a><!--<![endif]-->
                                        <!--[if lte IE 6]><table><tr><td><![endif]-->
                                        <ul>
                                                <li><a href="karlsbadCup2009.php">2009</a></li>
                                                <li><a href="karlsbadCupArchiv.php">Archiv</a></li>
                                        </ul>
                                        <!--[if lte IE 6]></td></tr></table></a><![endif]-->
                        </li>
                        <li><a href="index.php" class="fly">Vereinsmeisterschaften<!--[if gte IE 7]><!--></a><!--<![endif]-->
                                        <!--[if lte IE 6]><table><tr><td><![endif]-->
                                        <ul>
                                                <li><a href="vmErwachsene.php">Erwachsene</a></li>
                                                <li><a href="vmJugend.php">Jugend</a></li>
                                                <li><a rel="oeffneneuesfenster" href="dateien/archiv_sportliches/archiv_Vereinsmeisterschaften.pdf">Archiv</a></li>
                                        </ul>
                                        <!--[if lte IE 6]></td></tr></table></a><![endif]-->
                        </li>
                        <li><a href="turniererfolge.php">Turniererfolge</a></li>
                        <li><a href="turniervorschau.php">Turniervorschau</a></li>
                </ul>
                <!--[if lte IE 6]></td></tr></table></a><![endif]-->
        </li>

        <li class="top"><a href="index.php" id="jugend" class="top_link"><span class="down">JUGEND</span><!--[if gte IE 7]><!--></a><!--<![endif]-->
                <!--[if lte IE 6]><table><tr><td><![endif]-->
                <ul class="sub_jugend">
                        <li><a href="jugendAllgemein.php">Allgemein</a></li>
                        <li><a href="jugendAnsprechpartner.php">Ansprechpartner</a></li>
                        <li><a href="jugendTraining.php">Training</a></li>
                        <li><a href="index.php" class="fly">Mannschaften<!--[if gte IE 7]><!--></a><!--<![endif]-->
                                        <!--[if lte IE 6]><table><tr><td><![endif]-->
                                        <ul>
                                                 <li><a href="jugend.php">Jugend</a></li>
                                                 <li><a href="schuelerA.php">Sch&uuml;ler A</a></li>
                                        </ul>
                                        <!--[if lte IE 6]></td></tr></table></a><![endif]-->
                        </li>
                        <li><a href="jugendAuswaertsfahrten.php">Ausw&auml;rtsfahrten</a></li>
                        <li><a href="index.php" class="fly">Veranstaltungen<!--[if gte IE 7]><!--></a><!--<![endif]-->
                                        <!--[if lte IE 6]><table><tr><td><![endif]-->
                                        <ul>
                                                 <li><a href="jugendFreizeit.php">Freizeit</a></li>
                                                 <li><a href="jugendAusflug.php">Ausflug</a></li>
                                                 <li><a href="jugendTrainingstag.php">Trainingstag</a></li>
                                        </ul>
                                        <!--[if lte IE 6]></td></tr></table></a><![endif]-->
                        </li>
                </ul>
                <!--[if lte IE 6]></td></tr></table></a><![endif]-->
        </li>

        <li class="top"><a href="index.php" id="termine" class="top_link"><span class="down">TERMINE</span><!--[if gte IE 7]><!--></a><!--<![endif]-->
                <!--[if lte IE 6]><table><tr><td><![endif]-->
                <ul class="sub_termine">
                         <li><a rel="oeffneneuesfenster" href="dateien/gesamtspielplan.pdf">Gesamtplan</a></li>
                         <li><a href="termine2009.php">Termine 2009</a></li>
                </ul>
                <!--[if lte IE 6]></td></tr></table></a><![endif]-->
        </li>

        <li class="top"><a href="index.php" id="presse" class="top_link"><span class="down">PRESSE</span><!--[if gte IE 7]><!--></a><!--<![endif]-->
                <!--[if lte IE 6]><table><tr><td><![endif]-->
                <ul class="sub_presse">
                        <li><a href="presseAktuell.php">Aktuell</a></li>
                        <li><a href="presse2009.php">2009</a></li>
                        <li><a href="presseArchiv.php">Archiv</a></li>
                </ul>
                <!--[if lte IE 6]></td></tr></table></a><![endif]-->
        </li>

        <li class="top"><a href="index.php" id="bis_heute" class="top_link"><span class="down">1950 bis HEUTE</span><!--[if gte IE 7]><!--></a><!--<![endif]-->
                <!--[if lte IE 6]><table><tr><td><![endif]-->
                <ul class="sub_1950bisheute">
                        <li><a href="chronik.php">50 Jahre SVL/TTC</a></li>
                        <li><a href="30jahreTTC.php">30 Jahre TTC</a></li>
                        <li><a href="trikots_ttc.php">Trikotarchiv</a></li>
                        <li><a href="index.php" class="fly">In Memorium<!--[if gte IE 7]><!--></a><!--<![endif]-->
                                        <!--[if lte IE 6]><table><tr><td><![endif]-->
                                        <ul>
                                        <li><a href="karlSpiegel.php">Karl Spiegel</a></li>
                                        <li><a href="bertholdBrecht.php">Berthold Brecht</a></li>
                                        <li><a href="dorisRied.php">Doris Ried</a></li>
                                        <li><a href="wernerKohlmueller.php">Werner Kohlm&uuml;ller</a></li>
                                        <li><a href="brunoRohrer.php">Bruno Rohrer</a></li>
                                        <li><a href="wolfgangRupp.php">Wolfgang Rupp</a></li>
                                        <li><a href="uteSchmidt.php">Ute Schmidt</a></li>
                                        </ul>
                                        <!--[if lte IE 6]></td></tr></table></a><![endif]-->
                        </li>
                </ul>
                <!--[if lte IE 6]></td></tr></table></a><![endif]-->
        </li>

        <li class="top"><a href="index.php" id="aktivitaeten" class="top_link"><span class="down">AKTIVIT&Auml;TEN</span><!--[if gte IE 7]><!--></a><!--<![endif]-->
                <!--[if lte IE 6]><table><tr><td><![endif]-->
                <ul class="sub_aktivitaeten">
                        <li><a href="jahresabschlussfeier.php">Jahresabschlussfeier</a></li>
                        <li><a href="maiAusflug.php">1. Mai</a></li>
                        <li><a href="jahresausflug.php">Jahresausflug</a></li>
                        <li><a href="dorffest.php">Dorffest</a></li>
                        <li><a href="jugendFreizeit.php">Freizeit</a></li>
                        <li><a href="damenfreizeit.php">Damenfreizeit</a></li>
                        <li><a href="jahresausklang.php">Jahresausklang</a></li>
                        <li><a href="hochzeiten.php">Hochzeiten</a></li>
                </ul>
                <!--[if lte IE 6]></td></tr></table></a><![endif]-->
        </li>

        <li class="top"><a href="index.php" id="verein" class="top_link"><span class="down">VEREIN</span><!--[if gte IE 7]><!--></a><!--<![endif]-->
                <!--[if lte IE 6]><table><tr><td><![endif]-->
                <ul class="sub_verein">
                        <li><a href="news.php">News</a></li>
                        <li><a href="verwaltung.php">Verwaltung</a></li>
                        <li><a href="spiellokal.php">Spiellokal</a></li>
                        <li><a href="mitgliedschaft.php">Mitgliedschaft</a></li>
                        <li><a href="trainingszeiten.php">Trainingszeiten</a></li>
                </ul>
                <!--[if lte IE 6]></td></tr></table></a><![endif]-->
        </li>

        <li class="top"><a href="index.php" id="sonstiges" class="top_link"><span class="down">SONSTIGES</span><!--[if gte IE 7]><!--></a><!--<![endif]-->
                <!--[if lte IE 6]><table><tr><td><![endif]-->
                <ul class="sub_sonstiges">
                        <li><a href="sponsoren.php">Sponsoren</a></li>
                        <li><a href="links.php">Links</a></li>
                        <li><a href="bildergalerie.php">Galerie</a></li>
                        <li><a href="gaestebuch.php">G&auml;stebuch</a></li>
                        <li><a href="tibo.php">Tibo</a></li>
                        <li><a href="bundesliga.php">Bundesliga</a></li>
                        <li><a href="regeln.php">TT-Regeln</a></li>
                </ul>
                <!--[if lte IE 6]></td></tr></table></a><![endif]-->
        </li>

</ul>

evtl könnt ihr mir ja bei der problemlösung helfen.

mfg tobi

hallo jörg,

danke für die ersten hilfreichen tipps.

problem 1 habe ich dann damit gelöst:

.menu2 :hover ul.sub_turniere li {display:block; height:20px; position:relative; float:left; width:184px;}
.menu2 :hover ul.sub_turniere li a {display:block; font-size:14px; height:20px; width:184px; line-height:20px;

problem 2 mit den untermenüs, bereitet aber immer noch probleme.
das hier gilt ja für alle untermenüs, wenn ich mich nciht irre.

.menu2 :hover ul :hover ul :hover ul :hover ul :hover ul
{left:190px; top:-4px; background: #fff; padding:3px 0; border:1px solid #4ab; white-space:nowrap; width:93px; z-index:200; height:auto;}

kann ich dass auch splitten?
denn bei turniere, jugend, 1950 bis heute sind die menues ja unterschiedlich breit. und die untermenüs würden ja bei

left:190px

immer erst bei 190 anfangen, auch wenn das erste menu beispielsweiße bei 10px aufhört.

mfg tobi

Zitat von tobi

problem 2 mit den untermenüs, bereitet aber immer noch probleme.
das hier gilt ja für alle untermenüs, wenn ich mich nciht irre.

.menu2 :hover ul :hover ul :hover ul :hover ul :hover ul
{left:190px; top:-4px; background: #fff; padding:3px 0; border:1px solid #4ab; white-space:nowrap; width:93px; z-index:200; height:auto;}

kann ich dass auch splitten?
denn bei turniere, jugend, 1950 bis heute sind die menues ja unterschiedlich breit. und die untermenüs würden ja bei

left:190px

immer erst bei 190 anfangen, auch wenn das erste menu beispielsweiße bei 10px aufhört

Du kannst wie weiter oben auch, den Selektoren noch die betreffenden Klassen zuweisen:

 .menu2 :hover ul.sub_turniere /* und so weiter */