Wikipedia>Izno: /* Avoiding Linter errors */ +

2026-09-13T00:01:24Z

Avoiding Linter errors: +

New page

{{Documentation subpage}}

{{Tlr|clear=right|hlist|dotlist}}
{{Used in system|in [[MediaWiki:Citethispage-content]]}}
{{Uses TemplateStyles|Template:Hlist/styles.css|sandbox=Template:Horizontal list/sandbox/styles.css}}
{{Lua|Module:List}}
{{Cascade-protected template}}

This template creates [[WP:HLIST|horizontal lists]]. Each item in the list may be individually styled with [[CSS]].

Lists output by {{tl|Flatlist}} and {{tl|Horizontal list}} are semantically and visually identical, and differ only in the wiki markup used to create the lists.
__TOC__
{{-}}

== Usage ==
===Basic usage===

{{tlf|horizontal list|{{var|first item}}|{{var|second item}}|{{var|third item}}|{{var|...}}}}

===All parameters===

{{pre|<nowiki>{{</nowiki>horizontal list
<nowiki>|</nowiki>{{var|first item}}<nowiki>|</nowiki>{{var|second item}}<nowiki>|</nowiki>{{var|third item}}<nowiki>|</nowiki>...
<nowiki>|class = </nowiki>{{var|class for div tag}}
<nowiki>|style = </nowiki>{{var|style for div tag}}
<nowiki>|list_style = </nowiki>{{var|style for ul tag}}
<nowiki>|item_style = </nowiki>{{var|style for all li tags}}
<nowiki>|item1_style = </nowiki>{{var|style for first li tag}}
<nowiki>|item2_style = </nowiki>{{var|style for second li tag}}
<nowiki>|</nowiki>...
<nowiki>|indent = </nowiki>{{var|the number of tabs to indent}}
<nowiki>}}</nowiki>
}}

===Example===

{{demo
|<nowiki>{{horizontal list|Jazz|rock|pop|rap}}</nowiki>
|sep=produces:}}

== Parameters ==
* Positional parameters (<code>1</code>, <code>2</code>, <code>3</code>...): these are the list items. If no list items are present, the module will output nothing.
* <code>class</code>: a custom class for the {{tag|div}} tags surrounding the list. Set to <code>inline</code> when using {{tlf|horizontal list}} inside text.
* <code>style</code>: a custom CSS style for the {{tag|div}} tags surrounding the list, e.g. <code>font-size: 90%;</code>.
* <code>list_style</code>: a custom CSS style for the {{tag|ul}} tags around the list. The format is the same as for the {{para|style}} parameter.
* <code>item_style</code>: a custom CSS style for all of the list items (the {{Tag|li}} tags). The format is the same as for the {{para|style}} parameter.
*: Avoid using the style <code>white-space:nowrap</code> in the <code>item_style</code> parameter, because it will have the unintended effect of avoiding line breaks anywhere in the list, instead of just inside the list item; the workaround is to move this style in the <code>list_style</code> parameter, and then insert {{Tl|Wbr}} at the ''beginning'' of each item value, to insert an invisible word-break opportunity (and not at ''end'' of the item value, as the word-break would occur just before the trailing spaced-bullet separator).
* <code>item1_style</code>, <code>item2_style</code>, <code>item3_style</code>...: custom CSS styles for each of the list items. The format is the same as for the {{para|style}} parameter.
* <code>indent</code>: the number of tabs to indent the list. Default value is 0.

== Examples ==
{{Markup
| <nowiki>{{horizontal list|entry1|entry2|entry3|entry4|entry5|entry6|entry7|entry8|entry9}}</nowiki>
| {{horizontal list|entry1|entry2|entry3|entry4|entry5|entry6|entry7|entry8|entry9}}

| <nowiki>✘ Giant planets ({{horizontal list|[[Jupiter|J]]|[[Saturn|S]]|[[Uranus|U]]|[[Neptune|N]]}}).</nowiki>
| ✘ Giant planets ({{horizontal list|[[Jupiter|J]]|[[Saturn|S]]|[[Uranus|U]]|[[Neptune|N]]}}). ''(incorrect markup)''

| <nowiki>✔ Giant planets ({{horizontal list|class=inline|[[Jupiter|J]]|[[Saturn|S]]|[[Uranus|U]]|[[Neptune|N]]}}).</nowiki>
| ✔ Giant planets ({{horizontal list|class=inline|[[Jupiter|J]]|[[Saturn|S]]|[[Uranus|U]]|[[Neptune|N]]}}). ''(correct markup)''

| <nowiki>{{horizontal list|Winner|Runner-up|Third place|indent=2}}</nowiki>
| {{horizontal list|Winner|Runner-up|Third place|indent=2}}

| <nowiki>{{horizontal list|Winner|Runner-up|Third place|item_style=color:blue;}}</nowiki>
| {{horizontal list|Winner|Runner-up|Third place|item_style=color:blue;}}

| <nowiki>{{horizontal list|Winner|Runner-up|Third place|item1_style=background-color:yellow;color:black;|item2_style=background-color:silver;color:black;}}</nowiki>
| {{horizontal list|Winner|Runner-up|Third place|item1_style=background-color:yellow;color:black;|item2_style=background-color:silver;color:black;}}
}}

== Avoiding Linter errors ==

{{tlf|Horizontal list}} will produce [[Wikipedia:Linter|Linter]] [[Special:LintErrors/misc-tidy-replacement-issues|errors]] if placed inside a template that uses {{tag|span}} tags, such as {{tl|small}}, {{tl|larger}}, etc. To avoid this, use the substitutions from the table below:

{| class="wikitable"
! {{no|}} {{cross}} Incorrect markup !! {{yes|}} {{tick}} Correct markup
|-
| <code><nowiki>{{small|{{horizontal list|...}}}}</nowiki></code> || <code><nowiki>{{horizontal list|...|style=font-size:85%}}</nowiki></code>
|-
| <code><nowiki>{{resize|{{horizontal list|...}}}}</nowiki></code> || <code><nowiki>{{horizontal list|...|style=font-size:90%}}</nowiki></code>
|-
| <code><nowiki>{{midsize|{{horizontal list|...}}}}</nowiki></code> || <code><nowiki>{{horizontal list|...|style=font-size:92%}}</nowiki></code>
|-
| <code><nowiki>{{larger|{{horizontal list|...}}}}</nowiki></code> || <code><nowiki>{{horizontal list|...|style=font-size:120%}}</nowiki></code>
|-
| <code><nowiki>{{big|{{horizontal list|...}}}}</nowiki></code> || <code><nowiki>{{horizontal list|...|style=font-size:120%}}</nowiki></code>
|-
| <code><nowiki>{{large|{{horizontal list|...}}}}</nowiki></code> || <code><nowiki>{{horizontal list|...|style=font-size:120%}}</nowiki></code>
|-
| <code><nowiki>{{huge|{{horizontal list|...}}}}</nowiki></code> || <code><nowiki>{{horizontal list|...|style=font-size:180%}}</nowiki></code>
|-
| <code><nowiki>{{resize|x%|{{horizontal list|...}}}}</nowiki></code> || <code><nowiki>{{horizontal list|...|style=font-size:x%}}</nowiki></code>
|-
| <code><nowiki>{{font|size=x%|{{horizontal list|...}}}}</nowiki></code> || <code><nowiki>{{horizontal list|...|style=font-size:x%}}</nowiki></code>
|-
| <code><nowiki>{{nowrap|{{horizontal list|...}}}}</nowiki></code> || Don't do this, it's rarely appropriate.
|}

{{navbox lists}}
<includeonly>{{Sandbox other||

[[Category:Inline list formatting templates]]
[[Category:Variadic templates]]
}}</includeonly>

Template:Horizontal list/doc - Revision history

Wikipedia>Izno: /* Avoiding Linter errors */ +