Difference between revisions of "Help:Tables"

Revision as of 21:09, 21 September 2012

Tables are an amazing way to make tabular things.

The Basics

• All table code begins and ends in curly braces with pipes

{|
   Insert Table Code
|}

• An optional table caption appears at the top of the table when added with a |+

{|
|+ Table Caption
   More Table Code
|}

• Rows begin with |--- (Or however many dashes you want)

{|
|+ Table Caption
|---
   Cells Go Here
|---
   Cells Go Here Too
|}

• Cells begin with a single pipe on each new line

{|
|+ Table Caption
|---
| Cell 1
| Cell 2
|---
| Cell 1
| Cell 2
|}

• You could also just put them all on one line, with each cell separated by a double bar

{|
|+ Table Caption
|---
| Cell 1 || Cell 2
|---
| Cell 1 || Cell 2
|}

• Row and column headings are denoted by a ! instead of a |

{|
|+ Table Caption
! Column Heading 1
! Column Heading 2
|---
! Row Header
| Cell 2
|---
| Cell 1
| Cell 2
|}

• Optional parameters can affect individual tables, rows, or cells

{| border="1"
|+ Table Caption
! Column Heading 1
! Column Heading 2
|--- style="align: right"
! Row Header
| style="color: #9000A1; text-decoration: blink" | Cell 2
|---
| style="font-family: Courier New" | Cell 1 || style="background-color: red" | Cell 2
|}

• The final table looks like this:

Sortable Tables

To make your tables sortable, add class="sortable" at the top.

Example:

Tables sort based on what's in the first cell below the column header. This means that the sorting occasionally gets confused when you supply confusing inputs. Try clicking the sort button 4 times in the following example: