|
|
| Ligne 1 : |
Ligne 1 : |
| __NOTOC__ __NOEDITSECTION__ __SHOWFACTBOX__ | | __NOTOC__ __NOEDITSECTION__ __SHOWFACTBOX__ |
| | | <includeonly>[[Catégorie:Responsabilité partagée]]</includeonly> |
| Placement avec directive order-x
| |
| <div class="row"> | | <div class="row"> |
| <div class="col-4 order-2 border border-dark"> | | <div class="col-4 order-2"> |
| AAAA à droite parce que order-2 va déplacer ce div à droite (2e position)
| | <div class="card card-info"> |
| </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"> | | <div class="card-header"> |
| <h3>[[Partage des responsabilités en interstructure|Responsabilité partagée]]</h3> | | <h3>[[Partage des responsabilités en interstructure|Responsabilité partagée]]</h3> |
| Ligne 59 : |
Ligne 20 : |
|
| |
|
| </div> | | </div> |
| </div><!-- FERMETURE DE LA CARTE --> | | </div> |
| | </div> |
| | <div class="col-8 order-1"> |
|
| |
|
| </div><!-- FERMETURE DU PREMIER DIV À DRRRROITE -->
| | ==Description de la responsabilité== |
|
| |
|
| <div class="col-8 order-1"> <!-- ON VEUT QUE CE DIV AILLE À GÔCHE - order-1 -->
| | ===Contingence=== |
|
| |
|
| == EXEMPLE COMMENTÉ==
| | </div> |
| | | </div> |
| | |
| <!-- CONTENU DU DIV à gôche - bien fermé!! -->
| |
| BLA! BLA!
| |
| | |
| </div><!-- FERMETURE DU DEUXIÈME DIV À GÖCHE --> | |
| | |
| </div><!-- FERMETURE DU CONTAINER ROW --> | |
