« Utilisateur:Guillaume » : différence entre les versions
De Fab Labs Québec
Aucun résumé des modifications |
Aucun résumé des modifications |
||
| (3 versions intermédiaires par 2 utilisateurs non affichées) | |||
| Ligne 3 : | Ligne 3 : | ||
}} | }} | ||
| | |||
Placement avec directive order-x | |||
<div class="row"> | |||
<div class="col-4 order-2 border border-dark"> | |||
AAAA à droite parce que order-2 va déplacer ce div à droite (2e position) | |||
</div> | |||
<div class="col-8 order-1 border border-dark"> | |||
BBB à gauche parce que order-1 va déplacer ce div en premier | |||
</div> | |||
</div> | |||
Version alternative - moins compliquée, plus naturelle, pas de order | |||
<div class="row"> | |||
<div class="col-8 border border-dark"> | |||
BBB à gauche parce qu'en premier | |||
</div> | |||
<div class="col-4 border border-dark"> | |||
AAAA à droite parce que ce div vient après l'autre et que la taille des deux divs donne 12 (grid divisée en 12) | |||
</div> | |||
</div> | |||
Exemple de fonctionnement du grid | |||
<div class="row"> | |||
<div class="col-9 border border-dark"> | |||
BBB à gauche parce qu'en premier | |||
</div> | |||
<div class="col-4 border border-dark"> | |||
AAAA '''pas à droite''' parce que la taille des deux divs donne 13 | |||
</div> | |||
</div> | |||
<includeonly>[[Catégorie:Responsabilité partagée]]</includeonly> | |||
<div class="row"> <!-- ON OUVRE LE CONTAINER soit le class= ROW --> | |||
<div class="col-4 order-2"> <!-- ON VEUT QUE CE DIV AILLE À DRRRRROITE - order-2 --> | |||
<div class="card card-info"> <!-- CONTENU DU DIV à droite- on le veut bien fermé!! --> | |||
<div class="card-header"> | |||
<h3>[[Partage des responsabilités en interstructure|Responsabilité partagée]]</h3> | |||
</div> | |||
<div class="card-body"> | |||
; Qui peut être responsable | |||
; Temps de travail estimé | |||
; Préalables | |||
; Responsable·s | |||
</div> | |||
</div><!-- FERMETURE DE LA CARTE --> | |||
</div><!-- FERMETURE DU PREMIER DIV À DRRRROITE --> | |||
<div class="col-8 order-1"> <!-- ON VEUT QUE CE DIV AILLE À GÔCHE - order-1 --> | |||
== EXEMPLE COMMENTÉ== | |||
<!-- CONTENU DU DIV à gôche - bien fermé!! --> | |||
BLA! BLA! | |||
</div><!-- FERMETURE DU DEUXIÈME DIV À GÖCHE --> | |||
</div><!-- FERMETURE DU CONTAINER ROW --> | |||
Dernière version du 26 février 2024 à 12:51
Page de personne Ceci est votre page de personne qui vous présente aux autres. :
Guillaume Coulombe
La page d'utilisateur permet...
- D'organiser son travail dans le wiki
- Aux autres utilisateurs d'échanger avec vous, par votre page de discussion ("Discussion", dans la barre de navigation du haut).
Placement avec directive order-x
AAAA à droite parce que order-2 va déplacer ce div à droite (2e position)
BBB à gauche parce que order-1 va déplacer ce div en premier
Version alternative - moins compliquée, plus naturelle, pas de order
BBB à gauche parce qu'en premier
AAAA à droite parce que ce div vient après l'autre et que la taille des deux divs donne 12 (grid divisée en 12)
Exemple de fonctionnement du grid
BBB à gauche parce qu'en premier
AAAA pas à droite parce que la taille des deux divs donne 13
- Qui peut être responsable
- Temps de travail estimé
- Préalables
- Responsable·s
EXEMPLE COMMENTÉ
BLA! BLA!
