css et noms de classe dynamiques ?

Bonjour,

Dans mon template certains noms de classe sont dynamiques. Ex:

Code:

---

<div class="row-<?php echo $nb; ?>">

---

qui génère des noms de classe du type: row-1, row-2 etc...
Pour ce cas de figure j'utilise le selecteur ^ qui fait bien l'affaire:

Code:

---

1 2	div[class^="row-"] { }

---

Par contre j'ai aussi des éléments avec plusieurs classes:

Code:

---

<div class="item row-<?php echo $nb; ?>">

---

et là je n'arrive pas à trouver la bonne syntaxe.
Le seul truc qui marche est:

Code:

---

1 2	div[class^="item row-"] { }

---

mais ça ne va pas car si jamais une autre classe est ajoutée à l'élément ça ne fonctionne plus.

Code:

---

<div class="item bidule row-<?php echo $nb; ?>">

---

Quelqu'un aurait-il une solution ?

Merci

Bonjour,
je ne vois pas l'intérêt dans ce cas d'affecter plusieurs class à un élément!

Chaque class sert à définir des propriétés spécifiques.

Citation:

---

je ne vois pas l'intérêt dans ce cas d'affecter plusieurs class à un élément!

---

Je suis plutôt surpris par cette réponse ! 8O

Il est très courant d'utiliser plusieurs classes sur le même élément, d'ailleurs si le w3c le permet c'est qu'il y a une raison.
L'intérêt, entre autre, est de séparer les attributs css en différents groupes.
Par exemple une classe orientée décoration (couleurs, polices...) et une autre orientée positionnement (float etc...).
Ça permet une plus grande précision et une plus grande modularité.

Bref, ceci dit ça ne répond toujours pas à ma question. :mrgreen:
L'autre solution que j'ai trouvé est le sélecteur *

Code:

---

1 2	div[class*="row-"] { }

---

ça fonctionne mais je trouve que c'est un peu trop générique.

Quelqu'un connaitrait-il un moyen plus précis ?

On va reformuler alors :
Je ne vois pas l'intérêt d'utiliser des noms de classes dynamiques.

Pas trop besoin d'expliquer pourquoi : tu t'en rends déjà compte ! :mouarf:
Au pire, tu peux essayer de générer ta feuille de style dynamiquement en PHP, mais c'est franchement bancal comme solution...

Citation:

---

Je ne vois pas l'intérêt d'utiliser des noms de classes dynamiques.

---

C'est le template sur lequel je bosse qui est fait comme ça.
Lorsqu'on paramètre l'affichage sur 3 colonnes par ex, il génère
des noms de classe du type column-1, column-2 etc...
Ça permet d'affecter un style différent sur chaque colonne même si effectivement ce n'est pas utilisé tous les jours.

Pour ce qui est de générer la css dynamiquement, en effet... on oublie ! :mrgreen:
Je pense que je vais m'en tenir au sélecteur * ou bien simplement ignorer
ces classes.

Hello,

Plutôt que d'ajouter un nom de classe comme no de ligne, tu peux essayer de jouer avec les sélecteur :nth-child(n) ou :nth-of-type(n) (mais non supportés sur les vieux nav).

Pour ton problème de ciblage d'élément multiclasse, tu ne joues pas avec les bons sélecteurs. Tu devrais utiliser le sélecteur de classe simple pour tous les noms simples et ne conserver celui d'attribut que pour le cas vraiment nécessaire, soit celui ou tu veux cibler les noms de classe qui contiennent la chaîne row:

Code:

---

.item[class*="row-"]

---