Changer l'ordre des colonnes en responsive

 

Changer l'ordre des colonnes

 

Pour changer l'ordre des colonnes en mode responsive, il suffit d'ajouter une règle CSS au rangée qui contient les colonnes. Le béaba  : 

 

  • Ajouter deux colonnes dans votre rangée.

  • Mettre la valeur de largeur de chacune des colonnes en Responsive Display (menu Propriétés de colonne).



 



 

  • Sélectionner la rangée dans votre grille, et aller sur le menu Propriétés de row ; cliquer sur le dropdown CSS et ajouter une classe sur l'élément.  


 



 

  • Suite, il faut ajouter la règle CSS  `flex-direction: row-reverse`` à cette classe. Pour ce faire, aller sur le menu Client, cliquer sur Design et puis sur Personnaliser votre thème. Sélectionner la feuille de style à modifier, ajouter la règle CSS et publier la  feuille de style. 

 

 

  • NOTE:  Il est important de vider la cache de votre browser pour que la modification sur la feuille de style soit visible. 

 

  • Retourner dans votre grille. Vous allez voir que l’ordre de vos colonnes est maintenant inversé. Il faudra juste le mettre à la bonne place et re-publier la page.



 


 

  • Tester votre page. Vous allez voir que sur mobile, le contenu de la colonne à gauche se trouve toute en bas de la page.

 

© 2024 extenso Inc. All rights reserved.