Lavorare con la proprietà display in CSS

Sapete già che tutti i tag appartengono a un determinato modello di blocco. Tuttavia, se lo si desidera, è possibile cambiare il modello utilizzando la proprietà display. Utilizzando il valore block di questa proprietà è possibile rendere un elemento di blocco, e utilizzando il valore inline - in linea.

Facciamo in modo che i tag span si comportino come elementi di blocco:

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

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

E ora facciamo in modo che i tag div si comportino come elementi in linea:

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

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

Supponiamo che nel vostro codice HTML ci siano diversi paragrafi. Fate in modo che si comportino come elementi in linea.

Supponiamo che nel vostro codice HTML ci siano diversi link. Fate in modo che si comportino come elementi di blocco. Assegnate loro un bordo, una larghezza e un'altezza.