Template:Horizontal list
Appearance
| This template is used in MediaWiki:Citethispage-content, and on approximately 38,000 pages. Changes to it can cause immediate changes to the Wikipedia user interface. To avoid major disruption, any changes should be tested in the template's /sandbox or /testcases subpages, or in your own user subpage. The tested changes can be added to this page in a single edit. Please discuss changes on the talk page before implementing them. |
| This template uses TemplateStyles: |
| This template uses Lua: |
| This template can only be edited by administrators because it is transcluded onto one or more cascade-protected pages. |
This template creates horizontal lists. Each item in the list may be individually styled with CSS.
Lists output by {{Flatlist}} and {{Horizontal list}} are semantically and visually identical, and differ only in the wiki markup used to create the lists.
Usage
Basic usage
{{horizontal list|first item|second item|third item|...}}
All parameters
{{horizontal list
|first item|second item|third item|...
|class = class for div tag
|style = style for div tag
|list_style = style for ul tag
|item_style = style for all li tags
|item1_style = style for first li tag
|item2_style = style for second li tag
|...
|indent = the number of tabs to indent
}}
Example
{{horizontal list|Jazz|rock|pop|rap}}
- Jazz
- rock
- pop
- rap
Parameters
- Positional parameters (
1,2,3...): these are the list items. If no list items are present, the module will output nothing. class: a custom class for the<div>...</div>tags surrounding the list. Set toinlinewhen using {{horizontal list}} inside text.style: a custom CSS style for the<div>...</div>tags surrounding the list, e.g.font-size: 90%;.list_style: a custom CSS style for the<ul>...</ul>tags around the list. The format is the same as for the|style=parameter.item_style: a custom CSS style for all of the list items (the<li>...</li>tags). The format is the same as for the|style=parameter.- Avoid using the style
white-space:nowrapin theitem_styleparameter, 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 thelist_styleparameter, and then insert {{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).
- Avoid using the style
item1_style,item2_style,item3_style...: custom CSS styles for each of the list items. The format is the same as for the|style=parameter.indent: the number of tabs to indent the list. Default value is 0.
Examples
| Markup | Renders as |
|---|---|
{{horizontal list|entry1|entry2|entry3|entry4|entry5|entry6|entry7|entry8|entry9}} |
|
✘ Giant planets ({{horizontal list|[[Jupiter|J]]|[[Saturn|S]]|[[Uranus|U]]|[[Neptune|N]]}}). |
|
✔ Giant planets ({{horizontal list|class=inline|[[Jupiter|J]]|[[Saturn|S]]|[[Uranus|U]]|[[Neptune|N]]}}). |
|
{{horizontal list|Winner|Runner-up|Third place|indent=2}} |
|
{{horizontal list|Winner|Runner-up|Third place|item_style=color:blue;}} |
|
{{horizontal list|Winner|Runner-up|Third place|item1_style=background-color:yellow;color:black;|item2_style=background-color:silver;color:black;}} |
|
Avoiding Linter errors
{{Horizontal list}} will produce Linter errors if placed inside a template that uses <span>...</span> tags, such as {{small}}, {{larger}}, etc. To avoid this, use the substitutions from the table below:
{{small|{{horizontal list|...}}}} | {{horizontal list|...|style=font-size:85%}} |
{{resize|{{horizontal list|...}}}} | {{horizontal list|...|style=font-size:90%}} |
{{midsize|{{horizontal list|...}}}} | {{horizontal list|...|style=font-size:92%}} |
{{larger|{{horizontal list|...}}}} | {{horizontal list|...|style=font-size:120%}} |
{{big|{{horizontal list|...}}}} | {{horizontal list|...|style=font-size:120%}} |
{{large|{{horizontal list|...}}}} | {{horizontal list|...|style=font-size:120%}} |
{{huge|{{horizontal list|...}}}} | {{horizontal list|...|style=font-size:180%}} |
{{resize|x%|{{horizontal list|...}}}} | {{horizontal list|...|style=font-size:x%}} |
{{font|size=x%|{{horizontal list|...}}}} | {{horizontal list|...|style=font-size:x%}} |
{{nowrap|{{horizontal list|...}}}} | Don't do this, it's rarely appropriate. |
