G
Gast170816
Hallo,
ich werkel gerade was mit einem fertigen Wordpress-Template rum, da sind die Posts mit <li> aufgereiht, immer drei in einer Reihe.
Diese <li> haben diverse Klassen dranstehen, z.B. was allgemeines wie ".columns" (fertiger Templatekram halt) naja und praktischerweise steht aber auch immer individuell die Klasse der Kategorie dran, z.B. ".bilder" für die Kategorie Bilder oder ".video" für die Kategorie Video.
Nun will ich:
a) bei Bilder die CSS-Angabe belassen, mit 3 Post in einer Reihe, die lautet:
(also .grid steht im Template bei <ul class="grid">
b) Aber bei Video will ich 4 Post in einer Reihe, da hab ich das so umgetippt:
(ich hab .video genommen, weil doch die Klasse auch beim <li> dransteht und ich es speziell nur für die Kategorie Video haben will und .column ist ne Standardklasse, die schon im fertigen Template war, die brauch ich ja grad nicht und dachte so kann ich auch gleich die .video anpsrechen.Um ".columns" nun NUR für diese .video <li>s auszuschalten, das wüsste ich leider auch nicht, wo das geht (zu komplexer PHP-Kram).
...jedenfalls, b) funktioniert nicht. Mit Firebug kann ich erkennen, dass das "4n+1" beim ersten <li> angewendet wird, aber beim dritten steht immernoch 3n+1...dabei sind doch diese <li> alle gleichberechtigt, wenn es für das erste greift, warum steht beim dritten wieder 3n+1?
Ich kann auch nicht erkennen, dass irgendwelcher Wordpress-PHP-Code das verursacht, ich denke es liegt nur an einer "zu ungenauen" Ansprache der Klassen. Wie muss ich das oben bei b) denn ansprechen, damit es eindeutig und immer nur für alle <li> mit der Klasse .video das 4n+1 und NICHT MEHR 3n+1 gilt?
...
...naja, das geht jedenfalls auch nicht, erzeugt dasselbe Ergebnis wie oben b).
EDIT: Habe gerade gelesen, dass IE das nicht unterstützt...vielleicht sollte ich diesen "nth"-Ding ohnehin rauslöschen und einfach irgendwas mit "float:left" und halt umbrechen lassen. Das ganze Ding soll "responsive" sein, also sich auch auf mobilen Geräten anpassen...braucht man dazu dieses :nth?
ich werkel gerade was mit einem fertigen Wordpress-Template rum, da sind die Posts mit <li> aufgereiht, immer drei in einer Reihe.
Diese <li> haben diverse Klassen dranstehen, z.B. was allgemeines wie ".columns" (fertiger Templatekram halt) naja und praktischerweise steht aber auch immer individuell die Klasse der Kategorie dran, z.B. ".bilder" für die Kategorie Bilder oder ".video" für die Kategorie Video.
Nun will ich:
a) bei Bilder die CSS-Angabe belassen, mit 3 Post in einer Reihe, die lautet:
Code:
.grid .columns:nth-child(3n+1) { clear: left; margin-left: 0px; }b) Aber bei Video will ich 4 Post in einer Reihe, da hab ich das so umgetippt:
Code:
.grid .video:nth-child(4n+1) { clear: left; margin-left: 0px; }...jedenfalls, b) funktioniert nicht. Mit Firebug kann ich erkennen, dass das "4n+1" beim ersten <li> angewendet wird, aber beim dritten steht immernoch 3n+1...dabei sind doch diese <li> alle gleichberechtigt, wenn es für das erste greift, warum steht beim dritten wieder 3n+1?
Ich kann auch nicht erkennen, dass irgendwelcher Wordpress-PHP-Code das verursacht, ich denke es liegt nur an einer "zu ungenauen" Ansprache der Klassen. Wie muss ich das oben bei b) denn ansprechen, damit es eindeutig und immer nur für alle <li> mit der Klasse .video das 4n+1 und NICHT MEHR 3n+1 gilt?
...
Code:
li.video:nth-child(4n+1) { clear: left; margin-left: 0px; }EDIT: Habe gerade gelesen, dass IE das nicht unterstützt...vielleicht sollte ich diesen "nth"-Ding ohnehin rauslöschen und einfach irgendwas mit "float:left" und halt umbrechen lassen. Das ganze Ding soll "responsive" sein, also sich auch auf mobilen Geräten anpassen...braucht man dazu dieses :nth?
Zuletzt bearbeitet von einem Moderator:
): 1, 4, 7, 10, 13
