Centrer les colonnes bootstrap

Voici une petite astuce desormais bien connue pour centrer une colonne boostrap

Par exemple, pour un site qui contiendrait un conteneur principal sans sidebar, on pourrait donner à la colonne principale la classe suivante:

<div class="container">
    <div class="row">
		<div id="primary" class="col-sm-8 content-area">
			<main id="main" class="site-main" role="main">

On aurait alors notre colonne fixée à gauche , à cause des règles css bootstrap qui appliquent un float left aux colonnes

centrage bootstrap

L’astuce est alors de créer une classe additionnelle : col-centered, comme ceci

<div class="container">
    <div class="row">
		<div id="primary" class="col-centered col-sm-8 content-area">
			<main id="main" class="site-main" role="main">

Notre colonne sera donc centrée, grace à la règle: float:none

centrage bootstrap1

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *

Ce site utilise Akismet pour réduire les indésirables. En savoir plus sur comment les données de vos commentaires sont utilisées.