Difference between revisions of "Template:Columns/sandbox"

From blackwiki
Jump to navigation Jump to search
imported>SMcCandlish
(test)
imported>TheDJ
(resync)
Line 1: Line 1:
<table class="multicol {{{class|}}}" style="{{#switch:{{{align|}}}
+
<table class="multicol" style="{{#switch:{{{align|}}}
 
   |left|right=float:{{{align}}}
 
   |left|right=float:{{{align}}}
 
   |center=margin:0.5em auto
 
   |center=margin:0.5em auto
}};border-spacing:0;background:{{{background|{{{bgcol|transparent}}}}}};{{#if:{{{text-align|}}}|text-align:{{{text-align}}};}}{{{style|}}}" {{#if:{{{data|}}}||role="presentation"}}>
+
  }};border-spacing:0;background:{{{background|{{{bgcol|transparent}}}}}};{{#if:{{{text-align|}}}|text-align:{{{text-align}}};}}{{{style|}}}" role="presentation">
 
<tr style="vertical-align:top;">
 
<tr style="vertical-align:top;">
<td style="width:{{#if:{{{flex|}}}|{{{col1width|{{{colwidth|{{{width|}}}}}}}}}|{{{col1width|{{{colwidth|{{{width|15.0em}}}}}}}}}}};{{#if:{{{2|{{{col2<includeonly>|</includeonly>}}}}}}|padding-right:{{{gapbetween|{{{gap|1.25em}}}}}};}}"><div style="height:100%;{{{colstyle|}}};{{{col1style}}};">{{{1|{{{col1}}}}}}</div></td>
+
<td style="width:{{{col1width|{{{colwidth|{{{width|15.0em}}}}}}}}};{{{colstyle|}}};{{{col1style}}};">{{#ifeq:{{{col1width|{{{colwidth|{{{width|15.0em}}}}}}}}}|15.0em|[[Category:Pages using columns with the default column width]]}}
{{#if:{{{2|{{{col2<includeonly>|</includeonly>}}}}}}
+
{{{col1}}}</td>
      | <td style="width:{{#if:{{{flex|}}}|{{{col2width|{{{colwidth|{{{width|}}}}}}}}}|{{{col2width|{{{colwidth|{{{width|15.0em}}}}}}}}}}};{{#if:{{{3|{{{col3<includeonly>|</includeonly>}}}}}}|padding-right:{{{gapbetween|{{{gap|1.25em}}}}}};}}"><div style="height:100%;{{{colstyle|}}};{{{col2style}}};">{{{2|{{{col2}}}}}}</div></td>
+
{{#if:{{{col2<includeonly>|</includeonly>}}}
}}{{#if:{{{3|{{{col3<includeonly>|</includeonly>}}}}}}
+
      | <td style="width:{{{gapbetween|{{{gap|1.25em}}}}}};"></td>
      | <td style="width:{{#if:{{{flex|}}}|{{{col3width|{{{colwidth|{{{width|}}}}}}}}}|{{{col3width|{{{colwidth|{{{width|15.0em}}}}}}}}}}};{{{colstyle|}}};{{#if:{{{4|{{{col4<includeonly>|</includeonly>}}}}}}|padding-right:{{{gapbetween|{{{gap|1.25em}}}}}};}}{{{col3style}}};">
+
<td style="width:{{{col2width|{{{colwidth|{{{width|15.0em}}}}}}}}};{{{colstyle|}}};{{{col2style}}};">{{#ifeq:{{{col2width|{{{colwidth|{{{width|15.0em}}}}}}}}}|15.0em|[[Category:Pages using columns with the default column width]]}}
{{{3|{{{col3}}}}}}</td>
+
{{{col2}}}</td>
}}{{#if:{{{4|{{{col4<includeonly>|</includeonly>}}}}}}
+
}}{{#if:{{{col3<includeonly>|</includeonly>}}}
      | <td style="width:{{#if:{{{flex|}}}|{{{col4width|{{{colwidth|{{{width|}}}}}}}}}|{{{col4width|{{{colwidth|{{{width|15.0em}}}}}}}}}}};{{{colstyle|}}};{{#if:{{{5|{{{col5<includeonly>|</includeonly>}}}}}}|padding-right:{{{gapbetween|{{{gap|1.25em}}}}}};}}{{{col4style}}};">
+
      | <td style="width:{{{gapbetween|{{{gap|1.25em}}}}}};"></td>
{{{4|{{{col4}}}}}}</td>
+
<td style="width:{{{col3width|{{{colwidth|{{{width|15.0em}}}}}}}}};{{{colstyle|}}};{{{col3style}}};">{{#ifeq:{{{col3width|{{{colwidth|{{{width|15.0em}}}}}}}}}|15.0em|[[Category:Pages using columns with the default column width]]}}
}}{{#if:{{{5|{{{col5<includeonly>|</includeonly>}}}}}}
+
{{{col3}}}</td>
       | <td style="width:{{#if:{{{flex|}}}|{{{col5width|{{{colwidth|{{{width|}}}}}}}}}|{{{col5width|{{{colwidth|{{{width|15.0em}}}}}}}}}}};{{{colstyle|}}};{{#if:{{{6|{{{col6<includeonly>|</includeonly>}}}}}}|padding-right:{{{gapbetween|{{{gap|1.25em}}}}}};}}{{{col5style}}};">
+
}}{{#if:{{{col4<includeonly>|</includeonly>}}}
{{{5|{{{col5}}}}}}</td>
+
      | <td style="width:{{{gapbetween|{{{gap|1.25em}}}}}};"></td>
}}{{#if:{{{6|{{{col6<includeonly>|</includeonly>}}}}}}
+
<td style="width:{{{col4width|{{{colwidth|{{{width|15.0em}}}}}}}}};{{{colstyle|}}};{{{col4style}}};">{{#ifeq:{{{col4width|{{{colwidth|{{{width|15.0em}}}}}}}}}|15.0em|[[Category:Pages using columns with the default column width]]}}
      | <td style="width:{{#if:{{{flex|}}}|{{{col6width|{{{colwidth|{{{width|}}}}}}}}}|{{{col6width|{{{colwidth|{{{width|15.0em}}}}}}}}}}};{{{colstyle|}}};{{#if:{{{7|{{{col7<includeonly>|</includeonly>}}}}}}|padding-right:{{{gapbetween|{{{gap|1.25em}}}}}};}}{{{col6style}}};">
+
{{{col4}}}</td>
{{{6|{{{col6}}}}}}</td>
+
}}{{#if:{{{col5<includeonly>|</includeonly>}}}
}}{{#if:{{{7|{{{col7<includeonly>|</includeonly>}}}}}}
+
      | <td style="width:{{{gapbetween|{{{gap|1.25em}}}}}};"></td>
       | <td style="width:{{#if:{{{flex|}}}|{{{col7width|{{{colwidth|{{{width|}}}}}}}}}|{{{col7width|{{{colwidth|{{{width|15.0em}}}}}}}}}}};{{{colstyle|}}};{{#if:{{{8|{{{col8<includeonly>|</includeonly>}}}}}}|padding-right:{{{gapbetween|{{{gap|1.25em}}}}}};}}{{{col7style}}};">
+
<td style="width:{{{col5width|{{{colwidth|{{{width|15.0em}}}}}}}}};{{{colstyle|}}};{{{col5style}}};">{{#ifeq:{{{col5width|{{{colwidth|{{{width|15.0em}}}}}}}}}|15.0em|[[Category:Pages using columns with the default column width]]}}
{{{7|{{{col7}}}}}}</td>
+
{{{col5}}}</td>
}}{{#if:{{{8|{{{col8<includeonly>|</includeonly>}}}}}}
+
}}{{#if:{{{col6<includeonly>|</includeonly>}}}
      | <td style="width:{{#if:{{{flex|}}}|{{{col8width|{{{colwidth|{{{width|}}}}}}}}}|{{{col8width|{{{colwidth|{{{width|15.0em}}}}}}}}}}};{{{colstyle|}}};{{#if:{{{9|{{{col9<includeonly>|</includeonly>}}}}}}|padding-right:{{{gapbetween|{{{gap|1.25em}}}}}};}}{{{col8style}}};">
+
       | <td style="width:{{{gapbetween|{{{gap|1.25em}}}}}};"></td>
{{{8|{{{col8}}}}}}</td>
+
<td style="width:{{{col6width|{{{colwidth|{{{width|15.0em}}}}}}}}};{{{colstyle|}}};{{{col6style}}};">{{#ifeq:{{{col6width|{{{colwidth|{{{width|15.0em}}}}}}}}}|15.0em|[[Category:Pages using columns with the default column width]]}}
}}{{#if:{{{9|{{{col9<includeonly>|</includeonly>}}}}}}
+
{{{col6}}}</td>
      | <td style="width:{{#if:{{{flex|}}}|{{{col9width|{{{colwidth|{{{width|}}}}}}}}}|{{{col9width|{{{colwidth|{{{width|15.0em}}}}}}}}}}};{{{colstyle|}}};{{#if:{{{10|{{{col10<includeonly>|</includeonly>}}}}}}|padding-right:{{{gapbetween|{{{gap|1.25em}}}}}};}}{{{col9style}}};">
+
}}{{#if:{{{col7<includeonly>|</includeonly>}}}
{{{9|{{{col9}}}}}}</td>
+
      | <td style="width:{{{gapbetween|{{{gap|1.25em}}}}}};"></td>
}}{{#if:{{{10|{{{col10<includeonly>|</includeonly>}}}}}}
+
<td style="width:{{{col7width|{{{colwidth|{{{width|15.0em}}}}}}}}};{{{colstyle|}}};{{{col7style}}};">{{#ifeq:{{{col7width|{{{colwidth|{{{width|15.0em}}}}}}}}}|15.0em|[[Category:Pages using columns with the default column width]]}}
      | <td style="width:{{#if:{{{flex|}}}|{{{col10width|{{{colwidth|{{{width|}}}}}}}}}|{{{col10width|{{{colwidth|{{{width|15.0em}}}}}}}}}}};{{{colstyle|}}};{{{col10style}}};">
+
{{{col7}}}</td>
{{{10|{{{col10}}}}}}</td>
+
}}{{#if:{{{col8<includeonly>|</includeonly>}}}
 +
      | <td style="width:{{{gapbetween|{{{gap|1.25em}}}}}};"></td>
 +
<td style="width:{{{col8width|{{{colwidth|{{{width|15.0em}}}}}}}}};{{{colstyle|}}};{{{col8style}}};">{{#ifeq:{{{col8width|{{{colwidth|{{{width|15.0em}}}}}}}}}|15.0em|[[Category:Pages using columns with the default column width]]}}
 +
{{{col8}}}</td>
 +
}}{{#if:{{{col9<includeonly>|</includeonly>}}}
 +
       | <td style="width:{{{gapbetween|{{{gap|1.25em}}}}}};"></td>
 +
<td style="width:{{{col9width|{{{colwidth|{{{width|15.0em}}}}}}}}};{{{colstyle|}}};{{{col9style}}};">{{#ifeq:{{{col9width|{{{colwidth|{{{width|15.0em}}}}}}}}}|15.0em|[[Category:Pages using columns with the default column width]]}}
 +
{{{col9}}}</td>
 +
}}{{#if:{{{col10<includeonly>|</includeonly>}}}
 +
      | <td style="width:{{{gapbetween|{{{gap|1.25em}}}}}};"></td>
 +
<td style="width:{{{col10width|{{{colwidth|{{{width|15.0em}}}}}}}}};{{{colstyle|}}};{{{col10style}}};">{{#ifeq:{{{col10width|{{{colwidth|{{{width|15.0em}}}}}}}}}|15.0em|[[Category:Pages using columns with the default column width]]}}
 +
{{{col10}}}</td>
 
}}
 
}}
</tr></table><noinclude>
+
</tr></table><noinclude>{{Documentation}}</noinclude>
 
 
{{Documentation|Template:Columns/sandbox/documentation}}
 
 
 
</noinclude>
 

Revision as of 18:55, 12 July 2017

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" />