|
|||
dropdown menu
Minecraft-CMS -> ich wollte das hier machen (dropdown-menu): CSS-Tutorial: Aufklappmenü (Drop-Down Menü) | www.silent-fran.de
aber habs iwie nicht richtig hinbekommen, kann jemand meinen fehler erkennen/fixen? ich code jetzt schon seit um 5, und das ganze muss 10:30 fertig sein, also die naviagtion |
Sponsored Links |
|
|||
Ich weiss nicht wo dein Problem liegt, da ich es mir nicht näher angesehen habe, aber ich gebe dir mal eine Vorlage mit, die funktioniert.
HTML-Code:
<!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> <title>Simple Menu for all browsers</title> <style> /* ungeordnete Liste */ .menu ul{ list-style-type: none; /* Listenpunkte entfernen */ padding: 0; /* Innenabstände entfernen */ margin: 0; /* Aussenabstände entfernen */ font-family: verdana, sans-serif; /* Schrift setzen, wenn gewünscht */ } /* Listenelemente */ .menu li{ float: left; /* Alle nach Links schieben */ position: relative; /* realtiv positionieren für das Untermenü */ z-index: 100; /* Über andere Elemente erscheinen lassen */ } /* Links in Listenelementen */ .menu a, .menu:visited { display: block; /* Als Blockelement formatieren */ font-size: .9em; /* Schriftgrösse bestimmen */ width: 8em; /* Breite vorgeben */ padding: 5px 0 5px 0; /* Innenabstand Rand zur Schrift oben, rechts, unten, links */ color: white; /* Schriftfarbe */ background: black; /* Hintergrundfarbe */ text-decoration: none; /* Unterstrich bei Links entfernen */ margin-right: 1px; /* Abstand zum nächten Menüpunkt festlegen */ text-align: center; /* Schrift zentrieren */ line-height: 1.5em; /* Zeilenhöhe setzen, falls abweichend */ } /* Mauszeiger über Links*/ .menu a:hover{ color: yellow; /* Schriftfarbe ändern */ } /* Untermenüpunkte */ .menu ul ul { visibility: hidden; /* unsichtbar machen */ position: absolute; /* absolut positionieren */ width: 7em; /* Breite festlegen */ } /* Mauszeiger über Links im Untermenü */ .menu ul li:hover ul, .menu ul a:hover ul{ visibility: visible; /* Untermenü einblenden */ } </style> </head> <body> <div class="menu"> <ul> <li><a href="./">Punkt 1</a> <ul> <li><a href="./">Punkt 1.1</a></li> <li><a href="./">Punkt 1.2</a></li> <li><a href="./">Punkt 1.3</a></li> <li><a href="./">Punkt 1.4</a></li> </ul> </li> <li><a href="./">Punkt 2</a> <ul> <li><a href="./">Punkt 2.1</a></li> <li><a href="./">Punkt 2.2</a></li> <li><a href="./">Punkt 2.3</a></li> <li><a href="./">Punkt 2.4</a></li> </ul> </li> <li><a href="./">Punkt 3</a> <ul> <li><a href="./">Punkt 3.1</a></li> <li><a href="./">Punkt 3.2</a></li> <li><a href="./">Punkt 3.3</a></li> <li><a href="./">Punkt 3.4</a></li> </ul> </li> <li><a href="./">Punkt 4</a> <ul> <li><a href="./">Punkt 4.1</a></li> <li><a href="./">Punkt 4.2</a></li> <li><a href="./">Punkt 4.3</a></li> <li><a href="./">Punkt 4.4</a></li> </ul> </li> <li><a href="./">Punkt 5</a> <ul> <li><a href="./">Punkt 5.1</a></li> <li><a href="./">Punkt 5.2</a></li> <li><a href="./">Punkt 5.3</a></li> <li><a href="./">Punkt 5.4</a></li> </ul> </li> </ul> </div> </body> </html>
__________________
"Wieso ist der Code schrott, ich dachte hier seien Profis..." Aus einem Forum. |
Sponsored Links |
|
|||
Du musst doch lediglich das CSS kopieren und dann das HTML Menu, einfacher geht es nun wirklich nicht.
Wenn du dann den Abstand weg haben willst, setze im CSS das Margin-right auf 0px oder lösche den Punkt. Dein Fehler zu finden ist mir ehrlich gesagt zu aufwendig im Moment.
__________________
"Wieso ist der Code schrott, ich dachte hier seien Profis..." Aus einem Forum. |
Stichwörter |
css, dropdown menü, html, menü, navigation |
Themen-Optionen | |
Ansicht | |
|
|
Ähnliche Themen | ||||
Thema | Autor | Forum | Antworten | Letzter Beitrag |
Problem mit PullDown Menu auf ipad/iphone | smisonline2 | CSS | 1 | 13.05.2013 17:13 |
Hilfe css Menu center | xXcyberXx | CSS | 5 | 28.11.2010 19:51 |
Linkverhalten im IE6 | ChOpSueY! | CSS | 19 | 19.05.2008 22:48 |
Drop Down Menu Positionsproblem | Schky | CSS | 4 | 21.04.2008 13:09 |
Problem mit vertikaler Navigation | Krissie | CSS | 0 | 15.08.2007 12:51 |