Faire des doubles listes en css

Bonjour à tous !

Je lis régulièrement ce forum qui m'aide pas mal, mais aujourd'hui j'ai besoin de vos lumières...

Je dois faire des "doubles listes" en css ...
Une petite image vaut tous les commentaires :

J'ai essayé de le faire avec les listes et sous-liste... mais impossible de remonter la description à la hauteur de son "titre" (modification extérieur par exemple)

J'avais trouvé une autre manière sur le web, mais complètement incompatible avec Explorer windows

Mon problème est que les parties dans ma 2ème colonne peuvent prendre plusieur ligne donc pousse les éléments de la 2ème colonne vers le bas, mais alors mes élément de ma 1ère colonne doivent rester aligner avec leur contenu (2ème colonne)

Alors voilà, je sais pas comment m'y prendre

merci de votre aide

Salut.

Puisqu'il s'agit de définitions, utilisons les listes de définitions

<dl>
  <dt>Terme à définir:</dt>
  <dd>Ma définition pour ce premier terme.</dd>
  <dt>Terme suivant:</dt>
  <dd>Définition pour le terme suivant, qui va passer sur deux lignes si je continue à taper.</dd>
</dl>

dl {
  overflow: hidden;
  width: 600px;
}
dt {
  clear: both;
  float: left;
  width: 200px;
}
dd {
  float: right;
  width: 380px;
}

Une petite correction à faire pour IE6, dans des commentaires conditionnels adaptés :

dl {
  height: 1px;
  overflow: visible;
}

Pour comprendre de quoi il retourne, lire les articles suivants : Comment positionner les éléments en CSS et Comment éviter que mes éléments flottants (float) dépassent de leur conteneur ?

Hello,

À priori il s'agirait plus d'une structure titre/paragraphe que terme à définir/définition du terme. Ce n'est pas tout à fait la même logique.
(Mais ici ça ne serait pas bien problématique de partir sur une liste de définitions.)

Notons juste qu'avec titre/paragraphe, il sera plus simple d'utiliser un DIV pour regrouper chaque couple et gérer les espaces et le dépassement des flottants.