Difference between revisions of "Template:Columns/sandbox"

From blackwiki
Jump to navigation Jump to search
imported>SMcCandlish
(untest)
imported>SMcCandlish
(test)
Line 10: Line 10:
 
{{{2|{{{col2}}}}}}</td>
 
{{{2|{{{col2}}}}}}</td>
 
}}{{#if:{{{3|{{{col3<includeonly>|</includeonly>}}}}}}
 
}}{{#if:{{{3|{{{col3<includeonly>|</includeonly>}}}}}}
       | <td style="margin-left:{{{gapbetween|{{{gap|1.25em}}}}}}; width:{{#if:{{{flex|}}}|{{{col3width|{{{colwidth|{{{width|}}}}}}}}}|{{{col3width|{{{colwidth|{{{width|15.0em}}}}}}}}}}};{{{colstyle|}}};{{{col3style}}};">
+
       | <td style="padding-left:{{{gapbetween|{{{gap|1.25em}}}}}}; width:{{#if:{{{flex|}}}|{{{col3width|{{{colwidth|{{{width|}}}}}}}}}|{{{col3width|{{{colwidth|{{{width|15.0em}}}}}}}}}}};{{{colstyle|}}};{{{col3style}}};">
 
{{{3|{{{col3}}}}}}</td>
 
{{{3|{{{col3}}}}}}</td>
 
}}{{#if:{{{4|{{{col4<includeonly>|</includeonly>}}}}}}
 
}}{{#if:{{{4|{{{col4<includeonly>|</includeonly>}}}}}}
       | <td style="margin-left:{{{gapbetween|{{{gap|1.25em}}}}}}; width:{{#if:{{{flex|}}}|{{{col4width|{{{colwidth|{{{width|}}}}}}}}}|{{{col4width|{{{colwidth|{{{width|15.0em}}}}}}}}}}};{{{colstyle|}}};{{{col4style}}};">
+
       | <td style="padding-left:{{{gapbetween|{{{gap|1.25em}}}}}}; width:{{#if:{{{flex|}}}|{{{col4width|{{{colwidth|{{{width|}}}}}}}}}|{{{col4width|{{{colwidth|{{{width|15.0em}}}}}}}}}}};{{{colstyle|}}};{{{col4style}}};">
 
{{{4|{{{col4}}}}}}</td>
 
{{{4|{{{col4}}}}}}</td>
 
}}{{#if:{{{5|{{{col5<includeonly>|</includeonly>}}}}}}
 
}}{{#if:{{{5|{{{col5<includeonly>|</includeonly>}}}}}}
       | <td style="margin-left:{{{gapbetween|{{{gap|1.25em}}}}}}; width:{{#if:{{{flex|}}}|{{{col5width|{{{colwidth|{{{width|}}}}}}}}}|{{{col5width|{{{colwidth|{{{width|15.0em}}}}}}}}}}};{{{colstyle|}}};{{{col5style}}};">
+
       | <td style="padding-left:{{{gapbetween|{{{gap|1.25em}}}}}}; width:{{#if:{{{flex|}}}|{{{col5width|{{{colwidth|{{{width|}}}}}}}}}|{{{col5width|{{{colwidth|{{{width|15.0em}}}}}}}}}}};{{{colstyle|}}};{{{col5style}}};">
 
{{{5|{{{col5}}}}}}</td>
 
{{{5|{{{col5}}}}}}</td>
 
}}{{#if:{{{6|{{{col6<includeonly>|</includeonly>}}}}}}
 
}}{{#if:{{{6|{{{col6<includeonly>|</includeonly>}}}}}}
       | <td style="margin-left:{{{gapbetween|{{{gap|1.25em}}}}}}; width:{{#if:{{{flex|}}}|{{{col6width|{{{colwidth|{{{width|}}}}}}}}}|{{{col6width|{{{colwidth|{{{width|15.0em}}}}}}}}}}};{{{colstyle|}}};{{{col6style}}};">
+
       | <td style="padding-left:{{{gapbetween|{{{gap|1.25em}}}}}}; width:{{#if:{{{flex|}}}|{{{col6width|{{{colwidth|{{{width|}}}}}}}}}|{{{col6width|{{{colwidth|{{{width|15.0em}}}}}}}}}}};{{{colstyle|}}};{{{col6style}}};">
 
{{{6|{{{col6}}}}}}</td>
 
{{{6|{{{col6}}}}}}</td>
 
}}{{#if:{{{7|{{{col7<includeonly>|</includeonly>}}}}}}
 
}}{{#if:{{{7|{{{col7<includeonly>|</includeonly>}}}}}}
       | <td style="margin-left:{{{gapbetween|{{{gap|1.25em}}}}}}; width:{{#if:{{{flex|}}}|{{{col7width|{{{colwidth|{{{width|}}}}}}}}}|{{{col7width|{{{colwidth|{{{width|15.0em}}}}}}}}}}};{{{colstyle|}}};{{{col7style}}};">
+
       | <td style="padding-left:{{{gapbetween|{{{gap|1.25em}}}}}}; width:{{#if:{{{flex|}}}|{{{col7width|{{{colwidth|{{{width|}}}}}}}}}|{{{col7width|{{{colwidth|{{{width|15.0em}}}}}}}}}}};{{{colstyle|}}};{{{col7style}}};">
 
{{{7|{{{col7}}}}}}</td>
 
{{{7|{{{col7}}}}}}</td>
 
}}{{#if:{{{8|{{{col8<includeonly>|</includeonly>}}}}}}
 
}}{{#if:{{{8|{{{col8<includeonly>|</includeonly>}}}}}}
       | <td style="margin-left:{{{gapbetween|{{{gap|1.25em}}}}}}; width:{{#if:{{{flex|}}}|{{{col8width|{{{colwidth|{{{width|}}}}}}}}}|{{{col8width|{{{colwidth|{{{width|15.0em}}}}}}}}}}};{{{colstyle|}}};{{{col8style}}};">
+
       | <td style="padding-left:{{{gapbetween|{{{gap|1.25em}}}}}}; width:{{#if:{{{flex|}}}|{{{col8width|{{{colwidth|{{{width|}}}}}}}}}|{{{col8width|{{{colwidth|{{{width|15.0em}}}}}}}}}}};{{{colstyle|}}};{{{col8style}}};">
 
{{{8|{{{col8}}}}}}</td>
 
{{{8|{{{col8}}}}}}</td>
 
}}{{#if:{{{9|{{{col9<includeonly>|</includeonly>}}}}}}
 
}}{{#if:{{{9|{{{col9<includeonly>|</includeonly>}}}}}}
       | <td style="margin-left:{{{gapbetween|{{{gap|1.25em}}}}}}; width:{{#if:{{{flex|}}}|{{{col9width|{{{colwidth|{{{width|}}}}}}}}}|{{{col9width|{{{colwidth|{{{width|15.0em}}}}}}}}}}};{{{colstyle|}}};{{{col9style}}};">
+
       | <td style="padding-left:{{{gapbetween|{{{gap|1.25em}}}}}}; width:{{#if:{{{flex|}}}|{{{col9width|{{{colwidth|{{{width|}}}}}}}}}|{{{col9width|{{{colwidth|{{{width|15.0em}}}}}}}}}}};{{{colstyle|}}};{{{col9style}}};">
 
{{{9|{{{col9}}}}}}</td>
 
{{{9|{{{col9}}}}}}</td>
 
}}{{#if:{{{10|{{{col10<includeonly>|</includeonly>}}}}}}
 
}}{{#if:{{{10|{{{col10<includeonly>|</includeonly>}}}}}}
       | <td style="margin-left:{{{gapbetween|{{{gap|1.25em}}}}}}; width:{{#if:{{{flex|}}}|{{{col10width|{{{colwidth|{{{width|}}}}}}}}}|{{{col10width|{{{colwidth|{{{width|15.0em}}}}}}}}}}};{{{colstyle|}}};{{{col10style}}};">
+
       | <td style="padding-left:{{{gapbetween|{{{gap|1.25em}}}}}}; width:{{#if:{{{flex|}}}|{{{col10width|{{{colwidth|{{{width|}}}}}}}}}|{{{col10width|{{{colwidth|{{{width|15.0em}}}}}}}}}}};{{{colstyle|}}};{{{col10style}}};">
 
{{{10|{{{col10}}}}}}</td>
 
{{{10|{{{col10}}}}}}</td>
 
}}
 
}}

Revision as of 14:09, 17 July 2015

Test

Template documentation[view] [edit] [history] [purge]

{{Columns}} may be used to create up to ten columns across a page.

Syntax

Values for col1 and col2, i.e. the contents of the first and second columns, are expected.

{{Columns
| background =   <!-- Background (default is none) -->
| style =        <!-- Use to add extra overall CSS styling -->
| colwidth =     <!-- Width of each column (default 15.0em) -->
| gapbetween =   <!-- Gap (gutter) between each column (default 1.25em) -->
| col1width =    <!-- Use to set a custom width for col1 -->
| col1 =         <!-- (REQUIRED) First column's contents -->
| col2width =    <!-- Use to set a custom width for col2 (and so on) -->
| col2 =         <!-- (REQUIRED) Second column's contents -->
| col3width = 
| col3 = 
...
| col10width = 
| col10 = 
}}

The parameters  colstyle  and  col1style  to  col10style  may also be used to tailor all and/or individual columns' CSS styling.

Examples

Code
{{Columns
| col1 = This is a simple application of the columns template, demonstrating the default column widths
| col2 = and gaps between columns. See the next example for a more customized use of the template.
}}
Result



Code
{{Columns |background=beige |colwidth=8.5em |gap<!--between-->=3.25em

| col1 =
* These
* columns
* are
* more
* complex

| col2 =
The<br />background<br />is<br />beige

| col3 =
; Each : column
; is   : 8.5 [[Em (typography)|''em'']]
; wide

| col4 =
{{{!}}
!colspan="2"{{!}} and
{{!-}}
{{!}} the {{!!}} gap
{{!-}}
{{!}}colspan="2"{{!}} between
{{!-}}
{{!}} each {{!!}} is
{{!-}}
!colspan="2" align="center"{{!}} 3.25 ''em''
{{!}}}
}}
Result

See also

Column-generating template families

<section begin="table" />

Family Type
Handles wiki
 table code?Script error: No such module "If empty".
Responsive/
Mobile suited
Start template Column divider End template
"Col" Table Yes Yes {{Col-begin}},
{{Col-begin-fixed}} or
{{Col-begin-small}}
{{Col-break}} or
{{Col-2}} .. {{Col-5}}
{{Col-end}}
"Col-float" CSS float Yes Yes {{Col-float}} {{Col-float-break}} {{Col-float-end}}
"Columns" Table No Yes {{Columns}}
"Columns-list" CSS columns Yes Yes {{Columns-list}} (wrapper)
"Columns-start" CSS float Yes Yes {{Columns-start}} {{Column}} {{Columns-end}}
"Flex columns" CSS flexbox Yes Yes {{Flex columns}}
"Div col" CSS columns Yes Yes {{Div col}} {{Div col end}}

Script error: No such module "If empty". I.e., can the columns handle the wiki markup {| | || |- |} used to create tables? If not, templates that produce these elements (such as {{(!}}, {{!}}, {{!!}}, {{!-}}, {{!)}}) or HTML tags (<table>...</table>, <tr>...</tr>, etc.) will need to be used instead.<section end="table" />