Template:Table vertical alignment
 | This template is used on many pages and changes may be widely noticed. Test changes in the template's /sandbox or /testcases subpages, or in your own user subpage. Consider discussing changes on the talk page before implementing them. |
 | This template uses TemplateStyles: |
Purpose
[edit]To make it easier to vertically align table columns with less code.
Usage
[edit]Place {{Table vertical alignment}} above the table and then add some classes to the table.
| Class | Summary |
|---|---|
defaulttop
|
Vertically align all table cells top by default. |
defaultmiddle
|
Vertically align all table cells middle by default. May not be needed since cells are normally vertically aligned this way already. |
defaultbottom
|
Vertically align all table cells bottom by default. |
colNtop
|
Vertically align the cells in column N top, where N is a number. |
colNmiddle
|
Vertically align the cells in column N middle, where N is a number. |
colNbottom
|
Vertically align the cells in column N bottom, where N is a number. |
col-Ntop
|
Vertically align the cells in column N top counting from the right, where N is a number. |
col-Nmiddle
|
Vertically align the cells in column N middle counting from the right, where N is a number. |
col-Nbottom
|
Vertically align the cells in column N bottom counting from the right, where N is a number. |
The col classes override the default classes. Default classes affect table headers; col do not.
Example
[edit]{{table vertical alignment}}
{| class="wikitable defaulttop col3middle col-2bottom"
|+ A 5-column wikitable using defaulttop, col3middle, and col-2bottom
|- style="font-family:monospace"
! col header !! col header !! col header !! col header !! col header
|- style="font-family:monospace"
!scope="row"| row header
|
* col2
|
* c
* ol3
|
* c
* o
* l4
|
* c
* o
* l
* 4
|- style="font-family:monospace"
!scope="row"| row header
|
* col4
|
* c
* ol3
|
* c
* o
* l2
|
* c
* o
* l
* 1
|}
| col header | col header | col header | col header | col header |
|---|---|---|---|---|
| row header |
|
|
|
|
| row header |
|
|
|
|
Limitations
[edit]- Preview will not work unless
{{table vertical alignment}}is in that section. But if it is placed anywhere on the page, then table alignment will occur upon publishing. So to avoid bafflement and confusion by editors previewing sections, put it directly above each table its classes are used in. This is true for any table template using TemplateStyles. - Column numbers up to
col29(left-most 29) andcol-9(right-most 9) are supported. A table can have more columns but it cannot be vertically aligned with this method. - On tables using
rowspanorcolspan, using the classes may not work well on those rows because the alignment appears in wrong cells. Normal table code likestyle="vertical-align: top/middle/bottom;" | cell contentcan be added to individual cells, both to get the wanted alignment and override unwanted alignment.
See also
[edit]- {{table alignment}} - Same, but for horizontal alignment.
- {{shy}} - Can be used to help narrow columns by adding a soft hyphen to a word to allow it to wrap.
More template styles for tables:
- {{sticky header}} - Makes column headers stick to the top of the page while scrolling through table data.
- {{sticky table start}} - allows sticky rows and columns inside a scrollable area.
- {{sort under}} - moves the sorting arrows under the headers.
- {{row hover highlight}} - adds row hover highlighting, and option for white background.
- {{static row numbers}} - adds a column of row numbers to a table.