Forum Alsacréations : CSS et Standards Web

<dl> 

        <dt>Boucles d'oreilles :</dt> 

        <dd>IGI-F4G17316 - 0,24 carat<br /> 

          IGI-F4G17329 - 0,24 carat</dd>

 

        <dt>Pendentifs diamant rond :</dt> 

        <dd>CCIP-179255 - 0,23 carat</dd>

 

        (...)

 

        <dt>Solitaires :</dt> 

        <dd>CCIP-179233 - 0,22 carat</dd> 



        <dt>Solitaires :</dt> 

        <dd>CCIP-179209 - 0,55 carat</dd> 

</dl>

dl dt {

   font-weight: bold;

   display: inline;

   float: left;

   clear: left; }



dl dd {

   text-indent: 0;

   text-align: justify;

   margin-left: 210px; }

Florent V. a écrit :
Plus globalement, le choix des listes de définition n'est pas très pertinent ici. Il correspond à un vieil abus de «sémantique» qui consiste à dire que toute série d'éléments avec terme1 mis en rapport avec terme2 doit être une liste de définition, ce qui rend la liste de définition plutôt inutile pour distinguer... des définitions (et pas tout et n'importe quoi ).

Dans les exemples que tu cites, des tableaux ne seraient pas inappropriés.

Florent V. a écrit :
C'est bien un problème de CSS spécifiquement, et la réponse est ici

dl {

  position: relative;

}



dl dt {

  background-color: red /* débogage */

  position: absolute;

/* éventuellement width: 220px; selon le fond souhaité */

}



dl dd {

  background-color: blue;

  margin-left: 230px;

}