Twitter iPhone pliant OnePlus 11 PS5 Disney+ Orange Livebox Windows 11

dl dt dd et :last-child

3 réponses
Avatar
Une Bévue
dans mon html j'ai qqc comme :

<dl>
<dt>Def 1</dt>
<dd>Truc 1</dd>

[..]

<dt>Def n</dt>
<dd>Truc n</dd>
</dl>


la pluspart du temps je n'ai qu'un <dd /> après un <dt />
quelque fois j'en ajoute un, par javascript.

et je souhaiterais que, quelque soit le nombre de <dd /> après un
<dt />, le dernier (:last-child ?) il est un css différent
(margin-bottom plus grand.

mais bon ça ne marche pas comme je le souhaite car ce qui est pris est
le dernier <dd /> dans <dl /> et non pas après <dt />.

faut-il que je change mon html pour quelque chose comme :

<dl>
<dt>Def 1</dt>
<dd>Truc 1</dd>
</dl>

[..]

<dl>
<dt>Def n</dt>
<dd>Truc n</dd>
</dl>


c'est à dire que j'enferme chaque "groupe" de <dt /> <dd /> (1 ou deux)
dans un <dl /> ?

ce qqui me permettrait avec :last-child de changer le css du dernier <dd
/> dans un <dl /> donné ?

3 réponses

Avatar
Une Bévue
Le 19/01/2016 09:03, Une Bévue a écrit :
c'est à dire que j'enferme chaque "groupe" de <dt /> <dd /> (1 ou deux)
dans un <dl /> ?



auto-réponse : oui, ça ça marche, du coup je ne comprends pas pourquoi
l'imbrication a été prévue ainsi comme c'est une définition list on
aurait du avoir les dd imbriqués dans les dt non ?

<dl>
<dt>Définition 1
<dd> truc 1 de la définition 1</dd>
<dd> truc 2 de la définition 1</dd>
</dt>

[...]
<dt>Définition n
<dd> truc 1 de la définition n</dd>
<dd> truc 2 de la définition n</dd>
</dt>
</dl>

?
Avatar
Pierre Maurette
Une Bévue :
Le 19/01/2016 09:03, Une Bévue a écrit :
c'est à dire que j'enferme chaque "groupe" de <dt /> <dd /> (1 ou deux)
dans un <dl /> ?



auto-réponse : oui, ça ça marche, du coup je ne comprends pas pourquoi
l'imbrication a été prévue ainsi comme c'est une définition list on aurait du
avoir les dd imbriqués dans les dt non ?

<dl>
<dt>Définition 1
<dd> truc 1 de la définition 1</dd>
<dd> truc 2 de la définition 1</dd>
</dt>

[...]
<dt>Définition n
<dd> truc 1 de la définition n</dd>
<dd> truc 2 de la définition n</dd>
</dt>
</dl>

?



Pas encore utilisé les listes de définitions, mais il me semble que "ça
marche" un peu par hasard, c'est complètement à coté de la sémantique
du truc, autre chose que le "terme" de la définition *dans* un
<dt></dt> n'a pas de sens.

En revanche, vous pouvez faire:

<dl>
<dt>Définition 1</dt>
<dd> truc 1 de la définition 1</dd>
<dd> truc 2 de la définition 1</dd>
</dl>

[...]

<dl>
<dt>Définition n</dt>
<dd> truc 1 de la définition n</dd>
<dd> truc 2 de la définition n</dd>
</dl>

et peut-être:

<dl>
<dl>
<dt>Définition 1</dt>
<dd> truc 1 de la définition 1</dd>
<dd> truc 2 de la définition 1</dd>
</dl>

[...]

<dl>
<dt>Définition n</dt>
<dd> truc 1 de la définition n</dd>
<dd> truc 2 de la définition n</dd>
</dl>
</dl>


Vous pouvez également placer des listes, des paragraphes, etc. dans un
<dd></dd>.

Enfin, à la lecture de votre message initial, il semble que vous pouvez
facilement gérer une classe spécifique, au départ puis en javascript
(ou en JQuery).


--
Pierre Maurette
Avatar
Une Bévue
Le 19/01/2016 09:47, Pierre Maurette a écrit :
Une Bévue :
Le 19/01/2016 09:03, Une Bévue a écrit :



Pas encore utilisé les listes de définitions, mais il me semble que "ça
marche" un peu par hasard, c'est complètement à coté de la sémantique du
truc, autre chose que le "terme" de la définition *dans* un <dt></dt>
n'a pas de sens.



ouais, je vois ce que vous voulez dire, mais tout de même c'est génant
du point de vue css car on a bien envie après les différents trucs d'une
définition de séparer un peu plus ces trucs du terme de la définition.
enfin, la notion de sens en html, m'amuse un peu je dois dire.

En revanche, vous pouvez faire:

<dl>
<dt>Définition 1</dt>
<dd> truc 1 de la définition 1</dd>
<dd> truc 2 de la définition 1</dd>
</dl>

[...]

<dl>
<dt>Définition n</dt>
<dd> truc 1 de la définition n</dd>
<dd> truc 2 de la définition n</dd>
</dl>



ça, c'est ce que j'ai fait.
et qui roule.



Vous pouvez également placer des listes, des paragraphes, etc. dans un
<dd></dd>.

Enfin, à la lecture de votre message initial, il semble que vous pouvez
facilement gérer une classe spécifique, au départ puis en javascript (ou
en JQuery).



c'est ce que je souhaitais éviter...
et d'ailleurs j'utilise ReactJS.