Navi li li

[Michael]

Hallo,

ich habe eine zweistufige Navi links. Definiert habe ich ein div naviinnen und dann zwei Listen. Jetzt möchte ich die 2 Stufen aber unterschiedlich formatieren. Ich habe also in der CSS einmal #naviinnen li und einmal #naviinnen li li.

Leider werden jedoch die Angaben von naviinnen li li vom Server (Firefox und IE)ignoriert.

etwa so:

#naviinnen li {
        list-style-type: none;
       padding-left: -10px;
        margin-bottom: 15px;
        margin-left: -20px;

}

#naviinnen li li{

padding-left: -10px;
        margin-bottom: 10px;
        font-style: 80%;
        padding-right: 0px;
        margin-left: -20px;

}

Kann mir jemand sagen, was ich falsch mache?

Danke und viele Grüße

Michael

[suit]

Leider werden jedoch die Angaben von naviinnen li li vom Server (Firefox und IE)ignoriert.

Der Browser ist der Client, nicht der Server.

#naviinnen li {
        list-style-type: none;
       padding-left: -10px;
        margin-bottom: 15px;
        margin-left: -20px;

}

#naviinnen li li{

padding-left: -10px;
        margin-bottom: 10px;
        font-style: 80%;
        padding-right: 0px;
        margin-left: -20px;

}

Kann mir jemand sagen, was ich falsch mache?

Du lieferst eine unvollständige Problembeschreibung ab - ausgehend von den gegebenen Informationen kann man darauf schließen dass du ungültigen HTML-Code verwendest.

font-style: 80%; ist zwar Unsinn, aber dennoch sollten die abweichenden Angaben für margin-bottom sichtbar sein.

Warum du margin-left: -20px; und padding-left: -10px; unsinnigerweise nochmal angibst, erschließt sich mir nicht ganz.

Augenscheinlich fehlt es dir an <http://de.selfhtml.org/css/formate/kaskade.htm@title=Grundlagen in CSS>.

[MudGuard]

Hi,

Warum du margin-left: -20px; und padding-left: -10px; unsinnigerweise nochmal angibst, erschließt sich mir nicht ganz.

Insbesondere wo padding doch gar nicht negativ sein darf ...

cu,
Andreas

[Michael]

Hallo,

1. o.k., natürlich meine ich immer Browser, wenn ich Server sage
2. padding-left ist in der Tat unsinnig;
3. Doppelung natürlich auch, das ist nur beim Ausprobieren so stehen geblieben;
4. css-Grundlagen:  sind glaube ich schon da, vielleicht etwas oberflächlich und etwas eingerostet, wie auch immer, jedenfalls Danke für das Kompliment!

Sollte jedenfalls hier nichts zur Sache tun ...

Das Problem bleibt, dass alles was  unter #navi li li steht ignoriert wird.

Nochmals konkret:

HTMl-Code sieht etwa so aus:
 <div id="navi">
  <div id="naviinnen">
    <ul>
      <li><a href="1.html">1</a></li>
         <ul>
          <li><a href="1a.html">1a</a></li>
          <li><a href="1b.html">1b</a></li>
           <li><a href="1c.html"> 1c</a></li>
                  </ul>
      <li><a href="2.html">2</a></li>

<li><a href="3.html">3</a></li>
     </ul>
    </div></div>

Dann habe ich im CSS

navi und naviinen definiert:

#navi {
        float: left;
        width: 200px;

}
#naviinnen { margin-left: -20px;
             font-size: 120%;
        font-weight:bold;
}

und nun naviinnen li und naviinnen li li:

z. B.:

#naviinnen li {
        list-style-type: none;
         margin-bottom: 15px;
}

#naviinnen li li{
        list-style-type: circle;
        margin-bottom: 10px;
        font-size: smaller /*(oder 80%, warum soll das denn Unsinn sein?)*/;
}

Die Angaben bei naviinnen li li werden jedoch ignoriert.

Viele Grüße und Danke für Hilfe! (Wenn keine Hilfe möglich auch o.k. Abqualifizierende Kommentare nützen mir jedenfalls nichts.)

Michael

Hi,

Warum du margin-left: -20px; und padding-left: -10px; unsinnigerweise nochmal angibst, erschließt sich mir nicht ganz.

Insbesondere wo padding doch gar nicht negativ sein darf ...

cu,
Andreas

[Matthias Apsel]

Om nah hoo pez nyeetz, Michael!

font-size: smaller /(oder 80%, warum soll das denn Unsinn sein?)/;

weil da zuerst font-style stand.

schaff dir firebug an und schau was von deinem CSS ankommt.

Matthias

[Michael]

Oh, sorry, das war natürlich Blödsinn, hat aber nix mit dem Problem zu tun. Firebug habe ich.

Om nah hoo pez nyeetz, Michael!

font-size: smaller /*(oder 80%, warum soll das denn Unsinn sein?)*/;

weil da zuerst font-style stand.

schaff dir firebug an und schau was von deinem CSS ankommt.

Matthias

[suit]

Oh, sorry, das war natürlich Blödsinn, hat aber nix mit dem Problem zu tun.

Das habe ich urspünglich auch implizit gesagt, dass das damit nichts zu tun haben sollte.

[Michael]

Also, ich habe das Problem ja jetzt gelöst. Generell werde ich aber wohl nicht nochmals hier nachfragen, sondern lieber weiter rumprobieren. Wenn einem statt Lösungsangebote nur arrogant mangelnde Kompetenz vorgeworfen wird, ist das nicht sehr ersprießlich. Offenbar können auch manche Leute Schlampigkeit oder Flüchtigkeit nicht von Unwissen unterscheiden.

[ChrisB]

Hi,

Offenbar können auch manche Leute Schlampigkeit oder Flüchtigkeit nicht von Unwissen unterscheiden.

Bitte gewöhne dir einfach an, sowohl dein HTML als auch dein CSS zu validieren, bevor du fragst.

MfG ChrisB

[MudGuard]

Hi,

Wenn einem statt Lösungsangebote nur arrogant mangelnde Kompetenz vorgeworfen wird,

Tja, hier wird halt oft die Wahrheit ausgesprochen.

Offenbar können auch manche Leute Schlampigkeit oder Flüchtigkeit nicht von Unwissen unterscheiden.

Es ist schlicht unhöflich, Deine Frage schlampig zu stellen - wenn Du ordentliche Hilfe erwartest, solltest Du auch Sorgfalt für das Stellen der Frage anwenden.

cu,
Andreas

[suit]

Die ausführlichere Variante hast du schon gelesen?

Offenbar können auch manche Leute Schlampigkeit oder Flüchtigkeit nicht von Unwissen unterscheiden.

Wobei ich mich grade Frage ob ich lieber einen schlampigen Programmierer bzw. HTML-Autor einstellen würde oder einen Unwissenden ;)

[Cheatah]

Hi,

<ul>
      <li><a href="1.html">1</a></li>
         <ul>

<ul> darf nur <li> als Kinder haben, kein <ul>. Desweiteren selektierst Du <li>-Elemente, die Kinder von <li>-Elementen sind - das ist möglich (im Sinne von erlaubt), kommt in Deinem Code jedoch nicht vor.

Wenn Du auf Probleme der Art stößt, die Du gerade beobachtest, dann validiere immer zuerst Deine Codes.

Cheatah

[Michael]

Danke!

ich habe es nun begriffen. Ich habe das li zu früh zugemacht. Jetzt klappt es,

Viele Grüße

Michael

[suit]

<ul> darf nur <li> als Kinder haben, kein <ul>. Desweiteren selektierst Du <li>-Elemente, die Kinder von <li>-Elementen sind - das ist möglich (im Sinne von erlaubt), kommt in Deinem Code jedoch nicht vor.

Du solltest deine Grundlagenkenntnisse in CSS besser auch nochmal vertiefen

der Selektor li li funktioniert sehrwohl einwandfrei.

Das Leerzeichen ist der Nachfahren-Kombinater, der Kind-Kombinator ist das Größer-Zeichen.

li > li würde somit in einem gültigen HTML-Dokument niemals funktionieren, das müsste dann li > ul > li oder li > ol > li lauten - aber da macht ein älterer IE nicht mehr mit.

Wenn Du auf Probleme der Art stößt, die Du gerade beobachtest, dann validiere immer zuerst Deine Codes.

Das kann man so stehen lassen.

[suit]

1. o.k., natürlich meine ich immer Browser, wenn ich Server sage

Zitat 1465

4. css-Grundlagen:  sind glaube ich schon da, vielleicht etwas oberflächlich und etwas eingerostet, wie auch immer, jedenfalls Danke für das Kompliment!

Das war keine Beleidigung sondern eine Schlussfolgerung aufgrund der Fehler - du hattest immerhin in 9 Zeilen mindestens 5 Fehler. Bei so einer Fehlerquote erhälst du im österreichischen Schulnotensystem ungschaut einen Fetzen.

Sollte jedenfalls hier nichts zur Sache tun ...

Nein, in diesem Fall nicht - das hab' ich auch gesagt, darum lag die Vermutung nahe dass es sich um fehlerhaftes HTML handelt.

Und dieser Schluß war, wie du mit diesem Posting bestätigst, absolut korrekt - was genau daran falsch ist, hat dir Cheatah ja schon erklärt.

Viele Grüße und Danke für Hilfe! (Wenn keine Hilfe möglich auch o.k. Abqualifizierende Kommentare nützen mir jedenfalls nichts.)

Wie oben erwähnt, ich fand den Hinweis auf die möglicherweise fehlenden Grundlagenkenntnisse berechtigt, darum habe ich dir eben exakt diese Stelle verlinkt. Es war schlichtweg eine Faktenanalyse - mehr war zum gegebenen Zeitpunkt einfach nicht möglich. Ob deine Grundlagen nun nicht vorhanden oder nur eingerostet sind, tut nichts zur Sache - anstatt sie allgemein zu erlernen musst du sie halt auffrischen, da führt kaum ein Weg herum.