2013-12-05 16:21:10 +00:00
created: 20130914132100000
2014-01-25 14:47:25 +00:00
modified: 20140125144616046
2013-12-05 16:21:10 +00:00
tags: wikitext
title: Tables in WikiText
type: text/vnd.tiddlywiki
2013-09-14 14:06:16 +00:00
! Basics
TiddlyWiki5 formats tables using vertical bar characters like so:
```
|!Cell1 |!Cell2 |
|Cell3 |Cell3 |
```
Exclamation marks are used to indicate header cells. The example renders as:
|!Cell1 |!Cell2 |
|Cell3 |Cell3 |
! Cell Alignment
Table cell alignment is controlled by inserting space characters before and/or after the cell content. For example:
```
|Left aligned content |
| Right aligned content|
| Centred content |
|+++ a very wide column so we can see the alignment +++|
```
The example renders as:
|Left aligned content |
| Right aligned content|
| Centred content |
|+++ a very wide column so we can see the alignment +++|
2014-01-03 10:39:55 +00:00
! Cell vertical Alignment
2014-01-25 14:47:25 +00:00
Vertical alignment of cells is done by inserting either a `^` for top alignment or a `,` for bottom alignment as the first character of a cell. The normal horizontal alignment is still possible. For example:
2014-01-03 10:39:55 +00:00
```
|^top left |^ top center |^ top right|
|middle left | middle center | middle right|
|,bottom left |, bottom center |, bottom right|
```
The example renders as:
| :: | ::::::::::::::::::::::::::: | ::::::::::::::::::::::::::: | ::::::::::::::::::::::::::: | :: |
| ::<br>:: |^top left |^ top center |^ top right| ::<br>:: |
| ::<br>:: |middle left | middle center | middle right| ::<br>:: |
| ::<br>:: |,bottom left |, bottom center |, bottom right| ::<br>:: |
| :: | ::::::::::::::::::::::::::: | ::::::::::::::::::::::::::: | ::::::::::::::::::::::::::: | :: |
2014-01-25 14:47:25 +00:00
If you need to have a `^`or a `,` as the first character of a left aligned cell, you can use HTML escaping:
2014-01-03 10:39:55 +00:00
| `^` | &#94; |
| `,` | &#44; |
2013-09-14 14:06:16 +00:00
! Cell Merging
2014-01-03 10:39:55 +00:00
To merge a table cell with the one above, use the special cell text `~`. To merge a cell with the one to its left use the text `<`. To merge one to its right use `>`. For example:
2013-09-14 14:06:16 +00:00
```
|Cell1 |Cell2 |Cell3 |Cell4 |
2014-01-03 10:39:55 +00:00
|Cell5 |Cell6 |Cell7 |<|
2013-09-14 14:06:16 +00:00
|Cell5 |~|Cell7 |Cell8 |
2014-01-03 10:39:55 +00:00
|>|Cell9 |Cell10 |Cell11 |
2013-09-14 14:06:16 +00:00
```
Renders as:
|Cell1 |Cell2 |Cell3 |Cell4 |
2014-01-03 10:39:55 +00:00
|Cell5 |Cell6 |Cell7 |<|
2013-09-14 14:06:16 +00:00
|Cell5 |~|Cell7 |Cell8 |
2014-01-03 10:39:55 +00:00
|>|Cell9 |Cell10 |Cell11 |
2013-09-14 14:06:16 +00:00
! Table Classes, Captions, Headers and Footers
Table CSS classes, captions, headers and footers can be specified as special pseudo-rows:
```
|myclass anotherClass|k
|This is a caption |c
|Cell1 |Cell2 |
|Cell3 |Cell3 |
|Header|Header|h
|Footer|Footer|f
```
Renders as:
|myclass anotherClass|k
|This is a caption |c
|Cell1 |Cell2 |
|Cell3 |Cell3 |
|Header|Header|h
|Footer|Footer|f