Utiliser la classe : "wpeo-table"
sur la balise
# | Nom | Prénom | Genre |
---|---|---|---|
1 | Snow | Jon | Home |
2 | Targaryen | Daenerys | ND |
3 | Stark | Arya | Femme |
# | Nom | Prénom | Genre |
Les tableaux flexibles utilisent la propriété CSS Flexbox. Ils sont donc beaucoup plus permissif (multiligne, responsif, changement d'apparence, etc..)
Attention, bien que la classe principale du module soit la même, le HTML est différent
Taille générales des cellules
Appliquer cette classe "table-{NOMBRE_CELLULE}"
en fonction du nombre de cellule(s) de votre tableau.
Exemple : vous avez 4 cellules, utiliser la classe table-4. Vous pouvez aller jusqu'à 10 cellules.
Cette classe permet d'éviter les erreurs d'affichage en responsive
Changer la taille d'une cellule
Rajouter certaines classes aux cellules en elles-même changent leur taille. Voici les classes disponibles :
"table-25"
max-width: 25px;"table-50"
max-width: 50px;"table-75"
max-width: 75px;"table-100"
max-width: 100px;"table-125"
max-width: 125px;"table-150"
max-width: 150px;"table-175"
max-width: 175px;"table-200"
max-width: 200px;Alignement d'une cellule
Utiliser la classe "table-end"
justifie la cellule sur la droite
Autre(s) classe(s)
"table-padding-0"
enlève la paddingExemple regroupant les cas de figure