II est parfois nécessaire de décaler une colonne par rapport au bord de la grille, ou de laisser un espace entre deux colonnes.

La classe offset- permet de définir un décalage d'un certain nombre de colonnes vers la droite.

Par exemple:

<div class="row">
	<div class="col-9 offset-3">...</div>
	<div class="col-5">...</div>
  <div class="col-4 offset-2">...</div>
</div>

bootstrap_offset.png

On peut définir un décalage différent selon les tailles d'écran en ajoutant l'abréviation du breakpoint dans la classe.

Par exemple:

<div class="row"> 
	<div class="col-12 col-md-6 offset-md-3 offset-xl-5">...</div>
  <div class="col-6 offset-3 col-lg-12 offset-lg-0">...</div>
<div>

<aside> ⬅️ La grille responsive

</aside>

<aside> ➡️ Order - modifier l’ordre des colonnes

</aside>