Discussion :

[Gluups]

Bonjour tout le monde,

Je voudrais sélectionner une division dont le texte contient "Dernier message".

Est-ce que ceci peut fonctionner ?

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

div:contains("Dernier message")

Et si il y en a plusieurs à la suite, je peux ajouter nth-child ?

[Doksuri]

a ma connaissance, ce n'est pas possible en css... t'as un exemple de structure, qu'on voit ce qu'on peut faire de plus ?

sinon, a premiere vu, en JS c'est jouable

Code javascript :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
document.querySelectorAll('div').forEach(el => {
if(el.textContent.includes('Dernier message')) {
console.log(el);
}
});

[Gluups]

OK merci.

Ah, oui, là il faut être motivé, parce que je mets en forme un site qui est déjà en ligne, en utilisant l'extension Stylus, dans Firefox.

Il y a aussi moyen de mettre en œuvre du Javascript, mais il faut que je commence par me rappeler avec quelle extension. Et pour le moment c'est le seul besoin pour ça.

C'est dans le listing d'un forum, par défaut les détails sont cachés, je les ai fait revenir, mais je trouve qu'avec ça en italique ça serait plus clair.

Ah ou alors il y a un autre moyen.
La structure est comme ceci :

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
<div class="list-inner">
   <a class="topictitle"></a>
   <br />
   <div class="responsive-show">Dernier message par ...</div>
</div>

Je peux essayer de bricoler avec du nth-child ...

[Doksuri]

Code css :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
.list-inner div:last-of-type {
  color:red;
}

ou

Code css :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
.list-inner .responsive-show {
  color:red;
}

a voir du coup dans quel cas est utilise le div "responsive-show" ... est-ce qu'il est present ailleur ou pas

[Gluups]

Curieusement, si je mets last-of-type, les trois premiers éléments sont affectés (dernier message, nombre de messages, créateur). Il est vrai qu'on a du "a" et du "div" donc chacun est seul dans son type, alors j'ai mis nth-child(0n+1), mais ça fait pareil, là c'est plus bizarre je trouve.

En revanche avec responsive-show ça donne au final juste ce qu'il faut, alors que j'en voyais partout et du coup je n'osais pas trop y toucher.

Il reste un interligne mais destiné aux numéros de page, donc ça risque de ne pas être prudent de trop jouer avec.

Merci, beau boulot