Pour un affichage vertical en Mobile et horizontal en desktop il faut ajouter les classes -vertical & -horizontal-lg.

Terme long lorem ipsum dolor sit amet lorem ipsum dolor :
définition lorem ipsum dolor sit amet.
Terme court :
définition lorem ipsum dolor sit amet.

Exemple mobile vertical -> column-lg 4 avec les classes .-vertical .-column-lg, .-column-definition-width-4 & .-column-definition-text-align-right :

Terme lorem ipsum dolor sit amet :
Définition lorem ipsum dolor sit amet lorem ipsum dolor sit amet ipsum dolor
Terme court :
Définition un lorem ipsum dolor sit amet lorem ipsum dolor sit amet ipsum dolor
Définition deux lorem ipsum dolor sit amet lorem ipsum dolor sit amet
Définition trois lorem ipsum dolor sit amet lorem ipsum dolor sit amet
          

HTML


Pour un affichage vertical en Mobile et horizontal en desktop il faut ajouter les classes -vertical & -horizontal-lg.

Terme long lorem ipsum dolor sit amet lorem ipsum dolor :
définition lorem ipsum dolor sit amet.
Terme court :
définition lorem ipsum dolor sit amet.

Exemple mobile vertical -> column-lg 4 avec les classes .-vertical .-column-lg, .-column-definition-width-4 & .-column-definition-text-align-right :

Terme lorem ipsum dolor sit amet :
Définition lorem ipsum dolor sit amet lorem ipsum dolor sit amet ipsum dolor
Terme court :
Définition un lorem ipsum dolor sit amet lorem ipsum dolor sit amet ipsum dolor
Définition deux lorem ipsum dolor sit amet lorem ipsum dolor sit amet
Définition trois lorem ipsum dolor sit amet lorem ipsum dolor sit amet
-->

PUG

// Hybrid
.title-exemple 
  h4 Pour un affichage vertical en Mobile et horizontal en desktop il faut ajouter les classes #[code -vertical] & #[code -horizontal-lg].
dl.definition-list-version2.-vertical.-horizontal-lg
  .item
    dt Terme long lorem ipsum dolor sit amet lorem ipsum dolor :
    dd définition lorem ipsum dolor sit amet.
  .item
    dt Terme court :
    dd
      strong définition lorem ipsum dolor sit amet.
      
.documentation-space 
.title-exemple
  h4 Exemple mobile vertical -> column-lg 4 avec les classes #[code .-vertical] #[code .-column-lg], #[code .-column-definition-width-4] & #[code .-column-definition-text-align-right] :
dl.definition-list-version2.-vertical.-column-lg.-column-definition-text-align-right.-column-definition-width-4
  .item
    dt Terme lorem ipsum dolor sit amet :
    dd Définition lorem ipsum dolor sit amet lorem ipsum dolor sit amet ipsum dolor
  .item
    dt Terme court : 
    dd Définition un lorem ipsum dolor sit amet lorem ipsum dolor sit amet ipsum dolor
    dd Définition deux lorem ipsum dolor sit amet lorem ipsum dolor sit amet
    dd Définition trois lorem ipsum dolor sit amet lorem ipsum dolor sit amet