Hilfe bei Navigation

[Error257]

Ich habe die Navigation in Form eine rTabelle gemacht und der Rest hier im Bil erklärt:

 

[fiedel]

Das geht, indem du deine Navigation semantisch korrekt mit einer ungeordneten Liste (<ul>) auszeichnest und den Links (<a>) in den Listenpunkten (<li>) folgende CSS-Eigenschaft zuweist:

ul li a {
display: block;
width: ...[B]px[/B]; height: ...[B]px[/B];
}

 

[Error257]

jo dank aber ich hab herausgefunden, dass ein aufklappbaes menü besser is ls ein normales, deswegen wie code ich so ein aufklaappbares menü?:
"wenn man über das menü mit der maus fährt öffnet sich ein submenü nach unten"

 

[fiedel]

Das lässt sich auch mit CSS realisieren: Klick!

Weitere Linktipps:
Listamatic: one list, many options - Using CSS and a simple list to create radically different list options
http://www.cssplay.co.uk/menus/iframe_fix3.html

 

[Error257]

Error257
jo hab ich aber jetzt verschieben die aufklappmenüs die texte und so...wie kann ich das fixen???

 

[Efchen]

Ehm, was hastn Du da fabriziert?
Du solltest erstmal Deinen HTML-Code korrigieren, bevor Du Dich ans Aussehen machst.

Nicht nur, dass Du jeden einzelnen Menüpunkt in eine eigene Liste gesteckt hast, Du hast auch noch um jede Liste ein <div> gesetzt. Kannst Du mir den Sinn erklären?

1. Die <div> außen rum sind überflüssig wie ein Kropf. Geschenke wickelst Du auch nur einmal in Papier ein, nicht zweimal.
2. Die Menüpunkte Deines Menüs müssen natürlich alle zur SELBEN Liste gehören. Du hast also nur eine einzige Liste, in der Deine Punkte stehen. Wo etwas ausklappt, baust Du in den Listenpunkt <li> eine weitere Liste ein mit den Unterpunkten.
Wenn Du für alles eine eigene Liste hast, dann gehört das doch alles nicht mehr logisch zusammen, und das ist ja nicht richtig.

<ul>
  <li>Punkt1
    <ul>
      <li>Punkt 1.1</li>
      <li>Punkt 1.2</li>
    </ul>
  </li>
  <li>Punkt 2</li>
  <li>Punkt 3
    <ul>
      <li>Punkt 3.1</li>
    </ul>
  </li>
</ul>

Regelmäßig den Validator zu benutzen, bietet sich an!
http://validator.w3.org/check?uri=h...(detect+automatically)&doctype=Inline&group=0

 

[Error257]

ja tut mir leid...kann das erst seit nichtmal 2 wochen sorry =(

 

[Efchen]

Tut mir leid, das kann ich ja nicht wissen.
Aber bevor Du Dich mit kompexen CSS-Problemen auseinander setzt, solltest Du HTML beherrschen, das möchte ich Dir hiermit ans Herz legen.

 

[Error257]

jo thx aba könntest du mir bitte ein beispiel coden z.b so

<ul>
    <li>
    menu1
    </li>
        <ul class="liste">
            <li>
                submenu1.1
            </li>
            <li>submenu1.2</li>
        </ul>
    <li>menu 2</li>
        <ul class="liste">
            <li>submenu 2.1</li>
            <li>submenu 2.2</li>
        </ul>
    <li>menu3</li>
        <ul class="liste">
            <li>submenu3.1</li>
            <li>submenu3.2</li>
        </ul>
    </li>    
</ul>

und auch den css code, weil ich blick jezz nich richtig durch und das klappt net =( ich will mir das dann anschauen und personalisieren

 

[_Thor_]

Guck mal in Beitrag nummer 6, da ist ein Beispiel.

 

[Error257]

aso ich dachte das wär falsch da steht ja:
und das ist ja nicht richtig:
code

aber wie soll ich ein horizontales/ waagerechtes menü bauen?

 

[_Thor_]

aso ich dachte das wär falsch da steht ja:
und das ist ja nicht richtig:

Das, was du geschrieben hast, war nicht richtig, was Efchen geschrieben hat, schon.

aber wie soll ich ein horizontales/ waagerechtes menü bauen?

Mit CSS, indem du die Listenelemente floaten lässt.

ul li {
  float: left;
}

 

[Error257]

aso bei mir im css stand

div {
float:left;
}

könnt ihr mir bitte sagen wie das geht damit der inhalt nicht verschoben wird wenn eine <ul> aufklappt?

 

[fiedel]

ein waagerechtes aufklappmenü, das nach unten aufklappt klappt doch nur mit divs...<.<
könnt ihr mir bitte sagen wie das geht damit der inhalt nicht verschoben wird wenn eine <ul> aufklappt?

Das halte ich für ein Gerücht! Wieso sollte es nicht ohne funktionieren? Alle CSS-Eigenschaften, die du für das div-Tag verwendest, kannst du ganausogut auch für das ul-Tag nehmen.

 

[Error257]

stimmt das div tag hab im css hab ich voll vergessen ^^ und da sis kein gerücht das kommt von mir ^^
jezz weiß ich wie es geht...
könnt ihr mir bitte sagen wie ich es mache, dass der inhalt nich verschoben wird wenn eine <ul> aufklappt
und das mit dem
ul li {
float: left;
}
klappt nicht =(

 

[fiedel]

könnt ihr mir bitte sagen wie ich es mache, dass der inhalt nich verschoben wird wenn eine <ul> aufklappt

Wir können leider nicht hellsehen! ;) Wie wärs, wenn du uns etwas mehr Code zeigen würdest?

 

[_Thor_]

könnt ihr mir bitte sagen wie ich es mache, dass der inhalt nich verschoben wird wenn eine <ul> aufklappt

Da du das Menü ja horizontal haben möchtest, wird sich beim ausklappen der Untermenüs nichts verschieben.

und das mit dem
ul li {
float: left;
}
klappt nicht =(

Doch, das klappt, wenn du Efchens Beispiel nimmst. Wenn es nicht klappt, ist an deinem Code etwas falsch.

 

[Error257]

ul li {
float: left;
list-style-type: none;
}
ul li ul li {
float: none;

so is richtig...stolz ^^
selber herausgefunden =)

 

[Error257]

aber der text verschiebt sich...
guckt doch:
http://www.error257.kilu.de

 

[_Thor_]

Dann behebe mal die Fehler [Invalid] Markup Validation of http://www.error257.kilu.de/ - W3C Markup Validator