CSS für überlappende Spielkarten

[TS]

Hello,

Das erfüllt die Anforderung einer variablen Anzahl an li-Elementen nicht. Abgesehen davon hast du dir offenbar das gegebene Beispiel-Markup nicht angeschaut - eine für das Beispielmarkup geeignete "statische" CSS-Lösung wäre hier:

Na, wieviele Karten hat denn ein Kartenspiel? Darum schrieb ich ja "Brute Force".
Und ja, ich habe es mir kurz angeschaut, wollte aber hier keine Fertiglösung liefern, sondern nur eine Anregung.

li {
  margin-left:60px;
}

li ~ li {
  margin-left:40px;
}

li ~ li ~ li {
  margin-left:20px;
}

li ~ li ~ li ~ li {
  margin-left:0px;
}

...aber auch das erfüllt wie gesagt die Anforderungen an die Flexibilität nicht.

Copy & Paste macht es möglich. Wie lang darf eine Selektorenliste werden? ;-P

Da gibt es bestimmt auch eine Möglichkeit mit nth-child().

Ich habe eine gesucht, hab aber leider (noch) keine gefunden.

Kann man mit CSS eigentlich abfragen, um das wievielte Kind eines Elternelementes es sich handelt?

Meine kurze Recherche legt nahe, dass sowas mit CSS alleine nicht möglich ist - zumindest nicht insofern, dass man den "Index" gleich automatisiert in einen CSS-value verwursten könnte.

Genau daran dachte ich und an calc(). Aber ohne JS wird es wohl nicht gehen mit der Berechnung...

Liebe Grüße
Tom S.