Egenskaben empty-cells

Egenskaben empty-cells angiver til browseren, hvordan baggrund og ramme af tomme celler td eller celler th i en HTML tabel skal vises: om de skal vises eller ej.

En celle betragtes som tom i følgende tilfælde: der er ingen tegn overhovedet, cellen indeholder kun mellemrum (et eller flere), linjeskift eller tabulatortegn, eller hvis egenskaben visibility er sat til hidden.

For at gøre en celle ikke-tom, men alligevel uden synlig tekst, anvendes følgende trick: man indsætter et hårdt mellemrum   i cellen.

Egenskaben virker ikke, hvis border-collapse er sat til værdien collapse.

Syntaks

selektor {
	empty-cells: show | hide;
}

Værdier

Værdi	Beskrivelse
`show`	Baggrund og ramme vises for en tom celle.
`hide`	Baggrund og ramme vises ikke for en tom celle.

Standardværdi: show.

Eksempel . Værdien show

Lige nu i tabellen er nogle celler tomme, men de har alligevel ramme og baggrund:

<table>
	<tr>
		<td>celle</td>
		<td></td>
		<td>celle</td>
	</tr>
	<tr>
		<td></td>
		<td>celle</td>
		<td></td>
	</tr>
	<tr>
		<td>celle</td>
		<td>celle</td>
		<td>celle</td>
	</tr>
</table>

table {
	width: 400px;
	empty-cells: show;
}
td {
	border: 1px solid black;
	background-color: #f3f3f3;
	text-align: center;
}

Eksempel . Værdien hide

Men nu vil de tomme celler ikke have baggrund og ramme:

<table>
	<tr>
		<td>celle</td>
		<td></td>
		<td>celle</td>
	</tr>
	<tr>
		<td></td>
		<td>celle</td>
		<td></td>
	</tr>
	<tr>
		<td>celle</td>
		<td>celle</td>
		<td>celle</td>
	</tr>
</table>

table {
	width: 400px;
	empty-cells: hide;
}
td {
	border: 1px solid black;
	background-color: #f3f3f3;
	text-align: center;
}

Se også

pseudoklassen empty,
som angiver, hvordan et tomt element vil se ud