Egenskapen caption-side

Egenskapen caption-side sätter positionen för en tabellrubrik, skapad med taggen <caption>. Egenskapen kan ha två värden: top (ovanför tabellen, standard) eller bottom (under tabellen).

Syntax

selektor {
	caption-side: top | bottom;
}

Exempel

Låt oss placera rubriken ovanför tabellen:

<table border="1" width="300">
	<caption>Tabell</caption>
	<tr>
		<th>Rubrik</th>
		<th>Beskrivning</th>
	</tr>
	<tr>
		<td>text1</td>
		<td>text2</td>
	</tr>
</table>

table {
	width: 100%;
	border-collapse: collapse;
}
td {
	width: 200px;
	height: 100px;
	text-align: center;
}
caption {
	caption-side: top;
	font-weight: bold;
}

Exempel

Och låt oss nu flytta rubriken under tabellen:

<table border="1" width="300">
	<caption>Tabell</caption>
	<tr>
		<th>Rubrik</th>
		<th>Beskrivning</th>
	</tr>
	<tr>
		<td>text1</td>
		<td>text2</td>
	</tr>
</table>

table {
	width: 100%;
	border-collapse: collapse;
}
td {
	width: 200px;
	height: 100px;
	text-align: center;
}
caption {
	caption-side: bottom;
	font-weight: bold;
}

Se även

egenskapen bottom,
som sätter positionen för elementets nedre kant
egenskapen top,
som sätter positionen för elementets övre kant
egenskapen left,
som sätter positionen för elementets vänstra kant
egenskapen right,
som sätter positionen för elementets högra kant
pseudoelementet ::backdrop,
som sätter placering efter det första elementet