Template:Col-begin: Difference between revisions
(Removed redirect to Template:Div col) Tag: Removed redirect |
No edit summary |
||
| Line 1: | Line 1: | ||
<includeonly><div style="{{#if:{{{width|}}}|{{colwidth|{{{width}}}}}|{{column-count|{{{1|}}}}} {{column-gap | <includeonly><div style="{{#if:{{{width|}}}|{{colwidth|{{{width}}}}}|{{column-count|{{{1|}}}}} {{column-gap|{{{gap|}}}}} {{column-rule|{{{outset|}}}|outset|#eee}} }} {{#ifeq:{{lc:{{{small|}}}}}|yes|font-size:100%;}}; background-color:{{{color|}}};"></includeonly><noinclude> | ||
{{Documentation}} | {{Documentation}} | ||
</noinclude> | </noinclude> | ||
Latest revision as of 12:07, 13 August 2023
 | This template creates a table rather than actual columns. This means that it displays poorly on mobile devices or narrow screens and is sub-optimal in terms of accessibility. Approximately half of the readers of English Wikipedia articles are using mobile devices and may have trouble reading the content that is wrapped in this template. Please consider using one of the CSS-based column templates (listed at the end of this page) instead, or not using columns at all. |
| Column templates |
|---|
| Accessibility |
| Basic |
|
| Float |
|
| Div col |
|
The {{col-begin}}, {{col-break}} and {{col-end}} templates control columns of text on a page:
- {{col-begin}}: starts a table (followed by {{col-break}} for 1st column)
- {{col-break}}: triggers the start of each column
- {{col-end}}: ends the multi-column table.
The widths of columns can be specified by using various additional codes. See below for examples.
Usage
- {{col-begin|width=70%}}: start table with width.
- {{col-break|width=66%}}: start column-1 as 66% wide.
- This is text in col-1.
- {{col-break|width=33%}}: start column-2 as 33% wide.
- Text column-2.
- {{col-end}}
The table will have two columns, with column 1 twice (2×) the width of column 2.
A border of 2px (1px width on each side) corresponds to a 5%. Therefore, with a 2px border—for example, as in Wikipedia:Tutorial/Wrap-up and more info—the width needs to be 95% for the table to fit within the screen. Since it's possible that some tables might not have a border, correction on the individual page could be made after substitution. Another way to create a two column table is like this:
{{col-begin|width=95%}}
|-
|
Left column
|
Right column
|}
|
| style="text-align: left; vertical-align: top; " |
{{Col-begin}} {{Col-2}} Column 1 here {{Col-2}} Column 2 here {{Col-end}}
| style="text-align: left; vertical-align: top; padding-left: 2em; " |
{{Col-begin}} {{Col-3}} Column 1 here {{Col-3}} Column 2 here {{Col-3}} Column 3 here {{Col-end}}
| style="text-align: left; vertical-align: top; padding-left: 2em; " | and so on, up to {{Col-5}}
|}| style="text-align: left; vertical-align: top; " |
{{Col-begin}}
{{Col-break}}
Column 1 here
{{Col-break}}
Column 2 here
{{Col-break}}
Column 3 here
{{Col-break}}
Column 4 here
{{Col-break}}
Column 5 here
{{Col-break}}
Column 6 here
{{Col-end}}
| style="text-align: left; vertical-align: top; padding-left: 2em; " |
{{Columns-start|num=3}}
Column 1 here
{{Column}}
Column 2 here
{{Column}}
Column 3 here
{{Columns-end}}
|}
Examples
Here are some example codes that you can use to make columns of text in your wikipedia article. You can change the width of your columns by changing the code words that go between the text of your columns. Good luck!
{{col-begin}}
{{col-break}}
{| class="wikitable" style="width:18em"
|+ Production by year
|-
! 1980
| 50,000
|-
! 1990
| 75,000
|-
! 2000
| 90,000
|}
{{col-break}}
{| class="wikitable" style="width:18em"
|+ Profit by year
|-
! 1980
| $6,000
|-
! 1990
| $7,500
|-
! 2000
| $8,200
|}
{{col-end}}
gives:
| style="text-align: left; vertical-align: top; " |
| 1980 | 50,000 |
|---|---|
| 1990 | 75,000 |
| 2000 | 90,000 |
| style="text-align: left; vertical-align: top; " |
| 1980 | $6,000 |
|---|---|
| 1990 | $7,500 |
| 2000 | $8,200 |
|}
{{col-begin}}
{{col-2}}
{| class="wikitable" style="width:18em"
|+ Production by year
|-
! 1980
| 50,000
|-
! 1990
| 75,000
|-
! 2000
| 90,000
|}
{{col-2}}
{| class="wikitable" style="width:18em"
|+ Profit by year
|-
! 1980
| $6,000
|-
! 1990
| $7,500
|-
! 2000
| $8,200
|}
{{col-end}}
gives:
| style="width: 50%;text-align: left; vertical-align: top; " |
| 1980 | 50,000 |
|---|---|
| 1990 | 75,000 |
| 2000 | 90,000 |
| style="width: 50%;text-align: left; vertical-align: top; " |
| 1980 | $6,000 |
|---|---|
| 1990 | $7,500 |
| 2000 | $8,200 |
|}
{{col-begin}}
{{col-break|width=80%}}
{| class="wikitable" style="width:18em"
|+ Production by year
|-
! 1980
| 50,000
|-
! 1990
| 75,000
|-
! 2000
| 90,000
|}
{{col-break|width=20%}}
{| class="wikitable" style="width:18em"
|+ Profit by year
|-
! 1980
| $6,000
|-
! 1990
| $7,500
|-
! 2000
| $8,200
|}
{{col-end}}
{{col-begin|width=auto}}
{{col-break}}
{| class="wikitable" style="width:18em"
|+ Production by year
|-
! 1980
| 50,000
|-
! 1990
| 75,000
|-
! 2000
| 90,000
|}
{{col-break|gap=2em}}
{| class="wikitable" style="width:18em"
|+ Profit by year
|-
! 1980
| $6,000
|-
! 1990
| $7,500
|-
! 2000
| $8,200
|}
{{col-end}}
| style="text-align: left; vertical-align: top; " |
| 1980 | 50,000 |
|---|---|
| 1990 | 75,000 |
| 2000 | 90,000 |
| style="text-align: left; vertical-align: top; padding-left: 2em; " |
| 1980 | $6,000 |
|---|---|
| 1990 | $7,500 |
| 2000 | $8,200 |
|}
| style="text-align: left; vertical-align: top; " |
| 1980 | 50,000 |
|---|---|
| 1990 | 75,000 |
| 2000 | 90,000 |
| style="text-align: left; vertical-align: top; " |
| 1980 | $6,000 |
|---|---|
| 1990 | $7,500 |
| 2000 | $8,200 |
| style="text-align: left; vertical-align: top; " |
| Widgets | $25,000 |
|---|---|
| Foos | $65,500 |
| Bars | $28,000 |
|}
See also
Column-generating template families
| The templates listed here are not interchangeable. For example, using {{col-float}} with {{col-end}} instead of {{col-float-end}} would leave a HTML "div" (division) open, potentially harming any subsequent formatting. |
<section begin="table" />
| Family | Type | Handles wiki
table code?  |
Start template | Column divider | End template |
|---|---|---|---|---|---|
| "Col" | Table | Yes | {{Col-begin}}, {{Col-begin-fixed}} or {{Col-begin-small}} |
{{Col-break}} or {{Col-2}} .. {{Col-5}} |
{{Col-end}} |
| "Col-float" | CSS float | Yes | {{Col-float}} | {{Col-float-break}} | {{Col-float-end}} |
| "Columns" | Table | No | {{Columns}} | – | – |
| "Columns-list" | CSS columns | Yes | {{Columns-list}} (wrapper) | – | – |
| "Columns-start" | CSS float | Yes | {{Columns-start}} | {{Column}} | {{Columns-end}} |
| "Div col" | CSS columns | Yes | {{Div col}} | – | {{Div col end}} |
I.e., can the columns handle the wiki markup {| | || |- |} used to create tables? If not, templates that produce these elements (such as {{(!}}, {{!}}, {{!!}}, {{!-}}, {{!)}}) and/or HTML tags (<table>...</table>, <tr>...</tr>, etc.) will need to be used instead.<section end="table" />
TemplateData
TemplateData for Col-begin
This template starts a multi-column table.
| Parameter | Description | Type | Status | |
|---|---|---|---|---|
| Table width | width | The width of the complete table, defined as a percent (ie 50%), typically no more than 95% | String | optional |