Help:Team Fortress Wiki tablestyles

From Team Fortress Wiki
Jump to: navigation, search

This page gives information about syntax of available Team Fortress Wiki tablestyles. This is not a complete guide for using wiki tables, for that please see Wikipedia's table help.

Wikitables

The basic styling of tables can be applied by adding a class="wikitable" to the table parameter as in the following example.

{| class="wikitable"
! Column header 1
! Column header 2
|-
! Row header
| Cell 2
|}

Will be displayed as:

Column header 1 Column header 2
Row header Cell 2

As you can see, the default style includes the TF2 Wiki colors but does not include cell borders or header styles. This is a design feature which allows them to be flexible and extensible enough to apply different styles depending on the users preference.

Borders

There are four typical ways of applying (or removing) cell borders, the easiest (and preferred) method is to add a "grid" to the css class.

What you type How it displays
{| class="wikitable" border="1"
! Column header 1
! Column header 2
|-
! Row header
| Cell 2
|}
Column header 1 Column header 2
Row header Cell 2
{| class="wikitable grid"
! Column header 1
! Column header 2
|-
! Row header
| Cell 2
|}
Column header 1 Column header 2
Row header Cell 2
{| class="wikitable" style="border:1px #aaa solid;border-collapse:collapse;" 
! Column header 1
! Column header 2
|-
! Row header
| Cell 2
|}
Column header 1 Column header 2
Row header Cell 2
{| class="wikitable borderless"
! Column header 1
! Column header 2
|-
! Row header
| Cell 2
|}
Column header 1 Column header 2
Row header Cell 2

Headers

The default styling for a table header is to be bold but not have any specific colors applied. To apply the standard TF2 Wiki table header color, a class="header" will need to be specified to each element.

What you type How it displays
{| class="wikitable" 
! class="header" | Column header 1
! class="header" | Column header 2
|-
! Row header
| Cell 2
|}
Column header 1 Column header 2
Row header Cell 2
{| class="wikitable grid" 
! class="header" | Column header 1
! class="header" | Column header 2
|-
! Row header
| Cell 2
|}
Column header 1 Column header 2
Row header Cell 2

Additonal class extensions

Several CSS style extensions are available that, while not specific to tables, may be useful in specific table uses (nested tables for example). These are applied by including them within the class parameter, as demonstrated in the "grid" parameter above.

transparent
Allows the background layer to show through the table cells (including graphics).
nowrap
Forces the text to display as one line rather than wrapping round when whitespace characters occur.
nomargin
Cancels any inherited margin parameters.