Template:Columns: Difference between revisions

(15 intermediate revisions by the same user not shown)

Line 1:

{{{1}}}

</div></includeonly><noinclude>

==Description==

This template allows you to display content in multiple columns on a page. By default, it divides the content into three columns, but you can customize the number of columns by using the <code>count=</code> parameter. Optionally, you can add custom inline styles using the <code>style=</code> parameter to adjust the appearance of the columns.

This template allows you to display content in multiple columns on a page as a bulleted list.

==Usage==

{| style="width: 100%; text-align: left; margin: auto;" class="wikitable"

|-

! colspan="2" style="text-align: center;" | <span style="font-size: 115%;">Default Usage</span><br><span style="font-weight: normal;">When used with no additional parameters, the template will return a list split in 3 columns.</span>

! colspan="2" style="text-align: center;" | <span style="font-size: 115%;">Default Usage</span><br><div style="text-align: left;"><span style="font-weight: normal;">When used with no additional parameters, the template will return a list split in 3 columns.</span></div>

|-

! width=25%|You Type

!You Get

|-

| style="text-align: left~~; background-color: white~~;" |<pre>

| style="text-align: left;" |<pre>

{{columns|

* Item 1

Line 23:

}}

</pre>

~~| style="background-color: white;"~~ |{{columns|

|{{columns|

* Item 1

* Item 2

Line 32:

}}

|-

! colspan="2" style="text-align: center;" | <span style="font-size: 115%;">Count Parameter</span><br><span style="font-weight: normal;">You can specify the number of columns in the output through use of the <code>|count=</code> parameter.</span>

! colspan="2" style="text-align: center;" | <span style="font-size: 115%;">Count Parameter</span><br><div style="text-align: left;"><span style="font-weight: normal;">You can specify the number of columns in the output through use of the <code>count=</code> parameter.</span></div>

|-

! width=25%|You Type

!You Get

|-

| style="text-align: left~~; background-color: white~~;" |<pre>

| style="text-align: left;" |<pre>

{{columns|count=2|

* Item 1

Line 47:

}}

</pre>

~~| style="background-color: white;"~~ |{{columns|count=2|

|{{columns|count=2|

* Item 1

* Item 2

Line 56:

}}

|-

| style="text-align: left~~; background-color: white~~;" |<pre>

| style="text-align: left;" |<pre>

{{columns|count=4|

* Item 1

Line 64:

}}

</pre>

~~| style="background-color: white;"~~ |{{columns|count=4|

|{{columns|count=4|

* Item 1

* Item 2

Line 71:

}}

|-

! colspan="2" style="text-align: center;" | <span style="font-size: 115%;">Style Parameter</span><br><span style="font-weight: normal;">By passing the <code>|style=</code> parameter, you can alter the appearance of the column container using ~~inline~~ CSS ~~styles~~.<br>'''Note:''' The ~~styles~~ used in the example below are a small selection of the possible ~~styles~~ available.</span>

! colspan="2" style="text-align: center;" | <span style="font-size: 115%;">Style Parameter</span><br><div style="text-align: left;"><span style="font-weight: normal;">By passing the <code>style=</code> parameter, you can alter the appearance of the column container using various CSS attributes.<br><br><span style="font-size: 85%;">'''Note:''' The attributes used in the example below are a small selection of the possible attributes available. You can find more information on possible attributes [https://coding-help.fandom.com/wiki/Attributes#List_of_commonly_used_attributes here].</span></span></div>

|-

! width=25%|You Type

!You Get

|-

| style="text-align: left~~; background-color: white~~;" |<pre>

| style="text-align: left;" |<pre>

{{columns|style=font-size: 150%; border: ~~3px~~ solid #~~ddd~~; background-color: #efefef;|

{{columns|

style=font-size: 150%; border: 1px solid #A2A7AF; background-color: #efefef; font-family: 'Libre Baskerville;|

* Item 1

* Item 2

Line 86:

Line 87:

}}

</pre>

~~| style="background-color: white;"~~ |{{columns|style=font-size: 150%; border: 1px solid ~~black~~; background-color: #efefef;|

|{{columns|style=font-size: 150%; border: 1px solid #A2A7AF; background-color: #efefef; font-family: 'Libre Baskerville;|

* Item 1

* Item 2

Line 95:

Line 96:

}}

|-

! colspan="2" style="text-align: center;" | <span style="font-size: 115%;">Numbered List</span><br><span style="font-weight: normal;">A numbered list can be used by replacing <code>*</code> with <code>#</code>.</span>

! colspan="2" style="text-align: center;" | <span style="font-size: 115%;">Numbered List</span><br><div style="text-align: left;"><span style="font-weight: normal;">A numbered list can be used by replacing <code>*</code> with <code>#</code>.</span></div>

|-

! width=25%|You Type

!You Get

|-

| style="text-align: left~~; background-color: white~~;" |<pre>

| style="text-align: left;" |<pre>

{{columns|

# Item A

Line 110:

Line 111:

}}

</pre>

~~| style="background-color: white;"~~ |{{columns|

|{{columns|

# Item A

# Item B

Line 121:

Line 122:

== Articles Using Template ==

{{for|Special:WhatLinksHere/{{FULLPAGENAME}}|a full listing|here|pre=This list is limited to 25 pages}}

{{for|Special:WhatLinksHere/{{FULLPAGENAME}}|a full listing|here|pre=This list is limited to 100 pages}}

{{Special:WhatLinksHere/{{FULLPAGENAME}}|namespace=0|limit=25}}

{{Special:WhatLinksHere/{{FULLPAGENAME}}|namespace=0|limit=100}}{{Special:WhatLinksHere/{{FULLPAGENAME}}|namespace=100|limit=100}}

[[Category: ~~Templates~~]]

[[Category:Article Elements]]

@@ Line 1: / Line 1: @@
-<includeonly><div class="pillars" style="column-count: {{{count|3}}}; {{{style|}}}; margin-bottom: 0.5em;">
+<includeonly><div class="pillars" style="column-count: {{{count|3}}}; text-align: left; {{{style|}}}; margin-bottom: 0.5em;">
    {{{1}}}
 </div></includeonly><noinclude>
 ==Description==
-This template allows you to display content in multiple columns on a page. By default, it divides the content into three columns, but you can customize the number of columns by using the <code>count=</code> parameter. Optionally, you can add custom inline styles using the <code>style=</code> parameter to adjust the appearance of the columns.
+This template allows you to display content in multiple columns on a page as a bulleted list.
 ==Usage==
 {| style="width: 100%; text-align: left; margin: auto;" class="wikitable"
 |-
-! colspan="2" style="text-align: center;" | <span style="font-size: 115%;">Default Usage</span><br><span style="font-weight: normal;">When used with no additional parameters, the template will return a list split in 3 columns.</span>
+! colspan="2" style="text-align: center;" | <span style="font-size: 115%;">Default Usage</span><br><div style="text-align: left;"><span style="font-weight: normal;">When used with no additional parameters, the template will return a list split in 3 columns.</span></div>
 |-
 ! width=25%|You Type
 !You Get
 |-
-| style="text-align: left; background-color: white;" |<pre>
+| style="text-align: left;" |<pre>
 {{columns|
 * Item 1
@@ Line 23: / Line 23: @@
 }}
 </pre>
-| style="background-color: white;" |{{columns|
+|{{columns|
 * Item 1
 * Item 2
@@ Line 32: / Line 32: @@
 }}
 |-
-! colspan="2" style="text-align: center;" | <span style="font-size: 115%;">Count Parameter</span><br><span style="font-weight: normal;">You can specify the number of columns in the output through use of the <code>|count=</code> parameter.</span>
+! colspan="2" style="text-align: center;" | <span style="font-size: 115%;">Count Parameter</span><br><div style="text-align: left;"><span style="font-weight: normal;">You can specify the number of columns in the output through use of the <code>count=</code> parameter.</span></div>
 |-
 ! width=25%|You Type
 !You Get
 |-
-| style="text-align: left; background-color: white;" |<pre>
+| style="text-align: left;" |<pre>
 {{columns|count=2|
 * Item 1
@@ Line 47: / Line 47: @@
 }}
 </pre>
-| style="background-color: white;" |{{columns|count=2|
+|{{columns|count=2|
 * Item 1
 * Item 2
@@ Line 56: / Line 56: @@
 }}
 |-
-| style="text-align: left; background-color: white;" |<pre>
+| style="text-align: left;" |<pre>
 {{columns|count=4|
 * Item 1
@@ Line 64: / Line 64: @@
 }}
 </pre>
-| style="background-color: white;" |{{columns|count=4|
+|{{columns|count=4|
 * Item 1
 * Item 2
@@ Line 71: / Line 71: @@
 }}
 |-
-! colspan="2" style="text-align: center;" | <span style="font-size: 115%;">Style Parameter</span><br><span style="font-weight: normal;">By passing the <code>|style=</code> parameter, you can alter the appearance of the column container using inline CSS styles.<br>'''Note:''' The styles used in the example below are a small selection of the possible styles available.</span>
+! colspan="2" style="text-align: center;" | <span style="font-size: 115%;">Style Parameter</span><br><div style="text-align: left;"><span style="font-weight: normal;">By passing the <code>style=</code> parameter, you can alter the appearance of the column container using various CSS attributes.<br><br><span style="font-size: 85%;">'''Note:''' The attributes used in the example below are a small selection of the possible attributes available. You can find more information on possible attributes [https://coding-help.fandom.com/wiki/Attributes#List_of_commonly_used_attributes here].</span></span></div>
 |-
 ! width=25%|You Type
 !You Get
 |-
-| style="text-align: left; background-color: white;" |<pre>
+| style="text-align: left;" |<pre>
-{{columns|style=font-size: 150%; border: 3px solid #ddd; background-color: #efefef;|
+{{columns|
+style=font-size: 150%; border: 1px solid #A2A7AF; background-color: #efefef; font-family: 'Libre Baskerville;|
 * Item 1
 * Item 2
@@ Line 86: / Line 87: @@
 }}
 </pre>
-| style="background-color: white;" |{{columns|style=font-size: 150%; border: 1px solid black; background-color: #efefef;|
+|{{columns|style=font-size: 150%; border: 1px solid #A2A7AF; background-color: #efefef; font-family: 'Libre Baskerville;|
 * Item 1
 * Item 2
@@ Line 95: / Line 96: @@
 }}
 |-
-! colspan="2" style="text-align: center;" | <span style="font-size: 115%;">Numbered List</span><br><span style="font-weight: normal;">A numbered list can be used by replacing <code>*</code> with <code>#</code>.</span>
+! colspan="2" style="text-align: center;" | <span style="font-size: 115%;">Numbered List</span><br><div style="text-align: left;"><span style="font-weight: normal;">A numbered list can be used by replacing <code>*</code> with <code>#</code>.</span></div>
 |-
 ! width=25%|You Type
 !You Get
 |-
-| style="text-align: left; background-color: white;" |<pre>
+| style="text-align: left;" |<pre>
 {{columns|
 # Item A
@@ Line 110: / Line 111: @@
 }}
 </pre>
-| style="background-color: white;" |{{columns|
+|{{columns|
 # Item A
 # Item B
@@ Line 121: / Line 122: @@
 == Articles Using Template ==
-{{for|Special:WhatLinksHere/{{FULLPAGENAME}}|a full listing|here|pre=This list is limited to 25 pages}}
+{{for|Special:WhatLinksHere/{{FULLPAGENAME}}|a full listing|here|pre=This list is limited to 100 pages}}
-{{Special:WhatLinksHere/{{FULLPAGENAME}}|namespace=0|limit=25}}
+{{Special:WhatLinksHere/{{FULLPAGENAME}}|namespace=0|limit=100}}{{Special:WhatLinksHere/{{FULLPAGENAME}}|namespace=100|limit=100}}
-[[Category: Templates]]
+[[Category:Article Elements]]