Tables
caption-side
caption-side sets whether a table’s caption (the caption element) goes above or below the table.
Syntax
top | bottomPreview
| 個数 | |
|---|---|
| りんご | 3 |
| みかん | 5 |
Presets
Drag the bottom-right corner to resize
Code
.box {
caption-side: bottom;
}Controls
caption-sidebottom
| 個数 | |
|---|---|
| りんご | 3 |
| みかん | 5 |
About
Values
top: places the caption above the table. This is the initial value.bottom: places the caption below the table.
In vertical tables, top means the block-start side of the table and bottom the block-end side. In a writing-mode: vertical-rl table, top puts the caption on the right and bottom on the left.
Where to write it
It is inherited, so it works on the caption element, the table element, or an element around the table.
The preview gives the table inside the box a caption reading 「果物の数」 (number of fruits) and lets it take the value written on the box.