Travailler avec la propriété display en CSS

Vous savez déjà que toutes les balises appartiennent à un certain modèle de boîte. Si on le souhaite, cependant, on peut changer ce modèle à l'aide de la propriété display. Avec la valeur block de cette propriété, on peut rendre un élément de type bloc, et avec la valeur inline - de type en ligne.

Faisons en sorte que les balises span se comportent comme des éléments de bloc :

<span>text</span>
<span>text</span>
<span>text</span>

span {
	display: block;
	width: 100px;
	height: 100px;
	border: 1px solid red;
	margin-bottom: 20px;
}

Et maintenant, faisons en sorte que les balises div se comportent comme des éléments en ligne :

<div>text</div>
<div>text</div>
<div>text</div>

div {
	display: inline;
	width: 100px;
	height: 100px;
	border: 1px solid red;
}

Supposons que vous ayez plusieurs paragraphes dans votre code HTML. Faites en sorte qu'ils se comportent comme des éléments en ligne.

Supposons que vous ayez plusieurs liens dans votre code HTML. Faites en sorte qu'ils se comportent comme des éléments de bloc. Définissez-leur une bordure, une largeur et une hauteur.