css dropdown menu

[webicmedia]

hi leute,

ich weiß es gibt SEHR viele beiträge bezugs klappmenü durch css aber ich bin kein crack und kenn mich eigentlich nicht aus daher hab ich probleme die anderen codes zu verstehen und umzusetzen.

das ist mein div code (selbst geschrieben nichts dabei denken)

<div id="menu" class="menu">
        <div id="menu1" align="center"><a class="menu" href="#">webdesign</a></div>
        <div id="menu2" align="center"><a class="menu" href="#">development</a></div>
        <div id="menu3" align="center"><a class="menu" href="#">corporate identity</a></div>
        <div id="menu4" align="center"><a class="menu" href="#">printdesign</a></div>
        <div id="menu5" align="center"><a class="menu" href="#">home</a></div>
    </div>

das ist mein css style (auch selbst geschrieben)

#menu {
    margin-top: 30px;
    margin-left: auto;
    margin-right: auto;
    border-bottom: 5px;
    border-bottom-style: solid;
    border-bottom-color: #333333;
    position: relative;
}
#menu1 {
    margin-top: -25px;
    margin-left: 0px;
    width: 92px;
    position: absolute;
}
#menu2 {
    margin-top: -25px;
    margin-left: 93px;
    width: 109px;
    position: absolute;
}
#menu3 {
    margin-top: -25px;
    margin-left: 203px;
    width: 140px;
    position: absolute;
}
#menu4 {
    margin-top: -25px;
    margin-left: 344px;
    width: 101px;
    position: absolute;
}
#menu5 {
    margin-top: -25px;
    margin-left: 446px;
    width: 58px;
    position: absolute;
}


a.menu { display:block; font-size:15px; text-decoration:none; padding-bottom:4px; padding-top:1px;}

a.menu:link    { color:#333333; background-color:transparent; }
a.menu:visited { color:#333333; background-color:transparent; }
a.menu:hover   { color:#999999; background-color:#333333; }
a.menu:active  { color:#333333; background-color:transparent; }

so hab ich meine navigation gestaltet und jetzt soll einfach ein klappmenu ausfahren wenn ich mit der maus auf die buttons fahre. breite ist egal da soll ein text stehen kein weiters untermenü. was muss ich machen bzw wie?

bitte um schnelle hilfe und einfache erklärung. (wenn sich jemand die mühe macht und mir den code schreibt ist mir das nur recht )

 

[mermshaus]

Willkommen im Forum.

Was spricht denn gegen den Einsatz einer fertigen Lösung? Es steht in keinem Verhältnis, das Rad neu zu erfinden und sich den Aufwand zu machen, eine eigene Lösung browserübergreifend zu implementieren.

Ich denke, das hier ist zum Beispiel eine gute Übersicht:

- Stu Nicholls | CSSplay | CSS only menus

 

[Elroy]

Hallo.

Hier solltest du noch einmal von vorne anfangen oder wirklich eine fertige Lösung benutzen.

Eine Menü zeichnet man nicht als Ansammlung von divs aus sondern als Liste.
Die absoluten positionierungen sind absolut unnötig.
Wenn du schon ein CSS hast solltest du auch die gesamte Formatierung damit machen.

Nutz den Link den dir mermshaus dir gegeben hat, schau dir die Beispiele an und informiere dich auch noch ein bisschen über Semantik.

Gruss
Elroy