Alex: Created page with "{{Documentation}} The '''div col''' (short for division columns) formats a list into columns that wrap at multiple screen resolutions responsively. It automatically breaks the available screen space into equal parts. ==Usage and examples== ===Basic usage===

 {{div col}} * a * b * c * d * e * f * g * h {{div col end}}

Produces: {{div col}} * a * b * c * d * e * f * g * h {{div col end}} ===Colwidth===

 {{div col|colwidth=..."

2024-10-16T23:24:03Z

Created page with "{{Documentation}} The '''div col''' (short for division columns) formats a list into columns that wrap at multiple screen resolutions responsively. It automatically breaks the available screen space into equal parts. ==Usage and examples== ===Basic usage=== <pre> {{div col}} * a * b * c * d * e * f * g * h {{div col end}} </pre> Produces: {{div col}} * a * b * c * d * e * f * g * h {{div col end}} ===Colwidth=== <pre> {{div col|colwidth=..."

New page

{{Documentation}}

The '''div col''' (short for division columns) formats a list into columns that wrap at multiple screen resolutions responsively. It automatically breaks the available screen space into equal parts.

==Usage and examples==
===Basic usage===
<pre>
{{div col}}
* a
* b
* c
* d
* e
* f
* g
* h
{{div col end}}
</pre>

Produces:
{{div col}}
* a
* b
* c
* d
* e
* f
* g
* h
{{div col end}}

===Colwidth===
<pre>
{{div col|colwidth=10em}} 
* a
* b
* c
* d
* e
* f
* g
* h
{{div col end}}
</pre>

Produces:
{{div col|colwidth=10em}}
* a
* b
* c
* d
* e
* f
* g
* h
{{div col end}}

===Content===
<pre>
{{div col|content=
* a
* b
* c
* d
* e
* f
* g
* h
}}
</pre>

Produces:
{{div col|content=
* a
* b
* c
* d
* e
* f
* g
* h
}}

===Gap===
<pre>
{{div col|colwidth=10em|gap=2em}} 
* a
* b
* c
* d
* e
* f
* g
* h
{{div col end}}
</pre>

Produces:
{{div col|colwidth=10em|gap=2em}}
* a
* b
* c
* d
* e
* f
* g
* h
{{div col end}}

{{TemplateData|{{#switch: {{BASEPAGENAME}}
|Div col=<templatedata>
{
"description": "Breaks a list into columns. It automatically breaks each column to an equal space, so you do not manually have to find the half way point on two columns. The list is provided by |content= or closed with {{div col end}}.",
"params": {
"colwidth": {
"label": "Column width",
"description": "Specifies the width of columns, and determines dynamically the number of columns based on screen width; more columns will be shown on wider displays.",
"type": "string",
"example": "30em"
},
"gap": {
"label": "Gap size",
"description": "Specifies the space between the content of adjacent columns.",
"type": "string",
"example": "2em"
},
"class": {
"label": "HTML class",
"description": "Specifies any class or multiple space-delimited classes.",
"type": "string",
"example": "plainlist"
},
"style": {
"label": "CSS style",
"description": "Specifies any custom styling.",
"type": "string"
},
"content": {
"label": "Content",
"description": "Specifies the content to divide into columns",
"type": "content"
}
}
}
</templatedata>
|Div col end=<templatedata>
{
"description": "Ends a multi-column list started by {{div col}}. It takes no parameters.",
"params": {
}
}
</templatedata>}}}}

==See also==
* {{wp|Template:Div col|Same template on Wikipedia}}

Template:Div col/doc - Revision history