Bordo per lati singoli in CSS

Esistono anche proprietà abbreviate per lati singoli: border-left (bordo sinistro), border-right (bordo destro), border-top (bordo superiore), border-bottom (bordo inferiore).

Creiamo solo il bordo sinistro per un blocco usando la proprietà border-left:

<div id="elem"></div>

#elem {
	width: 300px;
	height: 100px;
	border-left: 1px solid red;
}

Ora creiamo simultaneamente sia il bordo sinistro che quello destro:

<div id="elem"></div>

#elem {
	width: 300px;
	height: 100px;
	border-left: 1px solid red;
	border-right: 1px solid red;
}

Riproduci la pagina secondo questo esempio: