Comment aligner un bloc DIV horizontalement avec CSS

Si vous souhaitez aligner l’élément <div> horizontalement par rapport à l’élément parent, vous pouvez utiliser la propriété margin avec la valeur « auto ». La valeur auto ajuste automatiquement les marges gauche et droite et aligne le bloc DIV horizontalement au centre.
 
 

Code source :
<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>Aligner un bloc DIV horizontalement avec CSS</title>
		<style>
			.box {
				width: 70%;
				margin: 0 auto;
				padding: 15px;
				background: #ff7d95;
			}
		</style>
	</head>
	<body>
		<div class="box">
			<h1>Titre</h1>
			<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
		</div>
	</body>
</html>
Résultat

Titre

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

 

Partagez cet article

Laisser un commentaire

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