Svojstvo caption-side

Svojstvo caption-side postavlja položaj naslova tabele, kreiranog pomoću taga <caption>. Ovo svojstvo može imati dve vrednosti: top (iznad tabele, podrazumevano) ili bottom (ispod tabele).

Sintaksa

selektor {
	caption-side: top | bottom;
}

Primer

Postavimo naslov iznad tabele:

<table border="1" width="300">
	<caption>Tabela</caption>
	<tr>
		<th>Zaglavlje</th>
		<th>Opis</th>
	</tr>
	<tr>
		<td>tekst1</td>
		<td>tekst2</td>
	</tr>
</table>

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

Primer

A sada pomerimo naslov ispod tabele:

<table border="1" width="300">
	<caption>Tabela</caption>
	<tr>
		<th>Zaglavlje</th>
		<th>Opis</th>
	</tr>
	<tr>
		<td>tekst1</td>
		<td>tekst2</td>
	</tr>
</table>

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

Vidi takođe

svojstvo bottom,
koje postavlja poziciju donje ivice elementa
svojstvo top,
koje postavlja poziciju gornje ivice elementa
svojstvo left,
koje postavlja poziciju leve ivice elementa
svojstvo right,
koje postavlja poziciju desne ivice elementa
pseudoelement ::backdrop,
koji postavlja poziciju iza prvog elementa