Listenstyle verändern

**Saad** · 16.11.2012, 21:13

heey Leute ! Ich hab da mal ein kleines Problem und zwar: Ich will, dass die Liste in meinem div, den ich mit der id "navi " versehen haben, eben nebeneinander erscheint.
Nun habe ich das in CSS mit folgender Anweisung gemacht:

HTML-Code:

li{
display: inline;
padding-right:2px;
	padding-left:10px;
text-agin:center;
}

So nun ist aber das Problem, dass ich noch eine Liste brauche, die eben nicht nebeneinander erscheint, aber wenn ich nun die zweite Liste dann mache, dann erscheint die genauso nebeneinander.
Wie mach ich das, dass eben die Liste nur im navi eben nebeneinander erscheint?

**Comu** · 16.11.2012, 21:27

HTML-Code:

#navi li {
 ... code
}

li {
 ... code
}

Du kannst dir die Struktur so vorstellen:

Main Child Child Child Child. Also beispielsweise ein <h1> Tag im <body> wäre:

HTML-Code:

html body h1 {
}

Das braucht man aber meistens nicht. So wird das aber angesprochen. In dem Fall werden jedoch ALLE li's in der #navi angesprochen. Wenn du jetzt weitere Listen in der Liste hast, werden diese somit auch formatiert. Um NUR die Liste zu formatieren, die wirklich direkt unter der navi ist kannst du das ">" Zeichen verwenden.

HTML-Code:

#navi > li {
 ... code
}

Formatiert nur das direkte li Element in der Navi.

**Pwned** · 16.11.2012, 21:28

Versuch, der Liste direkt eine ID zuzuweisen. Ich gehe mal davon aus, dass du es für eine Top-Navigation brauchst?

HTML-Code:

ul#topnav {
    margin: 0;
    padding: 0;
}
  
ul#topnav {
    list-style: none;
    margin: 0;
    padding: 0;
}

[/html]

Ansprechen kannst du es folgendermaßen:

HTML-Code:

<ul id="topnav">
    <li><a href="index.php">Startseite</a></li>
    <li><a href="other1.php">Andere Seite1</a></li>
    <li><a href="other2.php">Andere Seite2</a></li>
</ul>

Die andere Liste dann einfach ohne die ID erstellen.

**Saad** · 16.11.2012, 21:35

Passt danke euch zwei, hab's hin bekommen. (:

U-Labs

Account-Boerse

U-IMG

Thema: Listenstyle verändern

Listenstyle verändern

AW: Listenstyle verändern

The Following 2 Users Say Thank You to Comu For This Useful Post:

AW: Listenstyle verändern

The Following 2 Users Say Thank You to Pwned For This Useful Post:

AW: Listenstyle verändern

Ähnliche Themen

jQuery nur bestimmte Elemente verändern

Datenpakete abfangen und verändern

Wordpress Theme Abstand verändern