Comment placer une bordure à l’intérieur d’un bloc div en CSS

Dans ce tutoriel vous allez découvrir comment placer une bordure à l’intérieur d’un bloc div en CSS en utilisant simplement la propriété CSS3 box-sizing avec la valeur border-box.
 
 

Code CSS :
div {
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    width: 500px;
    height: 100px;
    border: 15px solid red;
    background: black;
    margin: 10px;
    color: #fff;
}

 

Code HTML :
<!DOCTYPE html>
<html>
	<head>
	<style type="text/css">
		/* Mettez le code CSS ici. */
	</style>
	</head>
	<body>
		<div>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</div>
	</body>
</html>
Résultat
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 *