View source for Template:Lineheight/doc

{{Documentation subpage}}
__NOTOC__
==Usage==
{{tl|lineheight}} changes the line height for a text string through the CSS property {{samp|line-height}}. It is primarily intended to be used with its default settings (not altering any parameters), i.e. for text spans that, for reasons of clarity, need or would benefit from a doubled line height.

The intended use is achieved by using the template syntax {{tlc|lineheight|''custom text''}}.

==Parameters==
There are 3 parameters, of which 1 is unnamed and required, and 2 are named and optional.

===Syntax===
The template's syntax is
* {{tlc|lineheight|''custom text''&nbsp;|height&#61;&nbsp;|tag&#61;&nbsp;}}

===Required parameter===
====1====
;<big>Custom text string</big>
The text for which you wish to change the line height. The parameter is unnamed, so no parameter name needs to be entered.

;<big>Usage</big>
* {{tlc|lineheight|<big>'''1'''</big>}}

===Optional parameters===
====height====
;<big>Line height</big>
By default, the template sets the line height to the value {{samp|200%}} (of the current font size), i.e. double the normal line height in MozillaWiki. You can enter a custom line height value, if you want to. There are different ways of specifying this value. See the available value types below, under ''Available values''.

;<big>Note</big>
* If the entered value doesn't conform to the rules, the template will output the text using MozillaWiki's standard line height.

;<big>Usage</big>
* {{tlc|lineheight|1|<big>'''height&#61;'''{{var|line height value}}</big>}}

;<big>Available values</big>
{| class="wikitable" style="background-color: white;"
|-
! Type !! Value type !! Value !! Template default !! Comments
|-
| rowspan="2" | CSS || rowspan="2" | CSS value || {{samp|inherit}} ||  || Value inherited from the parent element. Usually means normal MozillaWiki line height.
|-
| {{samp|normal}} ||  || Normal line height. May not be equal to MozillaWiki's standard line height.
|-
| rowspan="2" | Length {{sup|a)}} || rowspan="2" | Number value + px/em || e.g. {{samp|14px}} ||  || rowspan="2" | Negative values are invalid. <br>Use the decimal point, not the comma.
|-
| e.g. {{samp|2.5em}} ||
|-
| Percentage {{sup|a)}} || Number value + % || e.g. {{samp|125%}} || {{center|{{samp|200%}}}} || Line height in percent of current font size.
|-
| Number || Number value || e.g. {{samp|2.5}} ||  || Gets multiplied with the current font size to give the line height. <br>Negative values are invalid. <br>Use the decimal point, not the comma. <br>'''NB!''' There's no unit, only a number.
|}
{{sup|a)}} <span style="font-size:small;">When using ''length'' or ''percentage'', there can't be any space character between the number value and its unit ({{samp|px}} or {{samp|em}} for ''length'', and {{samp|%}} for ''percentage'').</span>

====tag====
;<big>HTML tag</big>
By default, the template outputs the text enclosed in {{tag|span|o}} tags, but it is possible to change the {{para|tag}} parameter value to one of a small number of other tag names. See the available value types below, under ''Available values''.

;<big>Usage</big>
* {{tlc|lineheight|1|<big>'''tag&#61;'''{{var|tag value}}</big>}}

;<big>Available values</big>
{| class="wikitable" style="background-color: white;"
|-
! Type !! Value !! Template default !! Comments
|-
| rowspan="5" | &nbsp;HTML tag&nbsp; || &nbsp;{{samp|blockquote}} ||  || rowspan="4" | &nbsp;Will output the specified tag.&nbsp;
|-
| &nbsp;{{samp|div}} ||
|-
| &nbsp;{{samp|p}} ||
|-
| &nbsp;{{samp|span}} || {{center|[[File:Green check.png|20px|link=]]}}
|-
| &nbsp;Other HTML tags {{sup|b)}}&nbsp; ||  || &nbsp;Will output {{tag|span|o}} tags.&nbsp;
|}
{{sup|b)}} <span style="font-size:small;">Any other HTML tag than the ones listed above will be ignored, and set the template to use {{tag|span|o}} tags.</span>

==Examples==
===Correct use===
{| class="wikitable" style="background-color: white;"
|-
! Parameter !! Value !! style="width: 200px;" | What you type !! style="width: 300px;" | What you see !! style="width: 200px;" | Comments
|-
| {{center|(none)}} || {{center|Control&nbsp;sample}} || {{code|At vero eos et accusamus et iusto odio dignissimos ducimus, qui blanditiis praesentium voluptatum deleniti […]}} || At vero eos et accusamus et iusto odio dignissimos ducimus, qui blanditiis praesentium voluptatum deleniti […] || Normal MozillaWiki line height output.
|-
| {{center|{{code|1}} (text)}} || {{center|Only text}} || {{tlc|lineheight|At vero eos et accusamus et iusto odio dignissimos ducimus, qui blanditiis praesentium voluptatum deleniti […]}} || {{lineheight|At vero eos et accusamus et iusto odio dignissimos ducimus, qui blanditiis praesentium voluptatum deleniti […]}} || Text automatically set to 200% line height, and output in {{tag|span|o}} tags.
|-
| rowspan="6" | {{center|{{code|height}}}} || {{center|{{samp|inherited}}}} || <code>&lt;div style="line-height:90%;"&gt;Deyr fé, &lt;br&gt;deyja frændur, &lt;br&gt;deyr sjálfur ið sama. &lt;br&gt;Eg veit einn &lt;br&gt;að aldrei deyr: &lt;br&gt;dómur um dauðan hvern. &lt;br&gt;&lt;br&gt;</code>'''{{tlc|lineheight|height{{=}}inherited|At vero eos et accusamus et iusto odio dignissimos ducimus, qui blanditiis praesentium voluptatum deleniti […]}}'''<code> &lt;br&gt;&lt;br&gt;Frühlingsmonate ist, sehr dürftig dagegen während des Sommers, indem dann viele Arten gleichsam gänzlich verschwinden. Zu dieser Jahreszeit erreicht dagegen die Vegetation in den tieferen Regionen ihren Höhepunkt.&lt;/div&gt;</code> || <div style="line-height:90%;">Deyr fé, <br>deyja frændur, <br>deyr sjálfur ið sama. <br>Eg veit einn <br>að aldrei deyr: <br>dómur um dauðan hvern. <br><br>'''{{lineheight|height=inherited|At vero eos et accusamus et iusto odio dignissimos ducimus, qui blanditiis praesentium voluptatum deleniti […]}}''' <br><br>Frühlingsmonate ist, sehr dürftig dagegen während des Sommers, indem dann viele Arten gleichsam gänzlich verschwinden. Zu dieser Jahreszeit erreicht dagegen die Vegetation in den tieferen Regionen ihren Höhepunkt.</div> || The line height value is inherited from the parent {{tag|div|o}} element.
|-
| {{center|{{samp|normal}}}} || <code>&lt;div style="line-height:90%;"&gt;Deyr fé, &lt;br&gt;deyja frændur, &lt;br&gt;deyr sjálfur ið sama. &lt;br&gt;Eg veit einn &lt;br&gt;að aldrei deyr: &lt;br&gt;dómur um dauðan hvern. &lt;br&gt;&lt;br&gt;</code>'''{{tlc|lineheight|height{{=}}normal|At vero eos et accusamus et iusto odio dignissimos ducimus, qui blanditiis praesentium voluptatum deleniti […]}}'''<code> &lt;br&gt;&lt;br&gt;Frühlingsmonate ist, sehr dürftig dagegen während des Sommers, indem dann viele Arten gleichsam gänzlich verschwinden. Zu dieser Jahreszeit erreicht dagegen die Vegetation in den tieferen Regionen ihren Höhepunkt.&lt;/div&gt;</code> || <div style="line-height:90%;">Deyr fé, <br>deyja frændur, <br>deyr sjálfur ið sama. <br>Eg veit einn <br>að aldrei deyr: <br>dómur um dauðan hvern. <br><br>'''{{lineheight|height=normal|At vero eos et accusamus et iusto odio dignissimos ducimus, qui blanditiis praesentium voluptatum deleniti […]}}''' <br><br>Frühlingsmonate ist, sehr dürftig dagegen während des Sommers, indem dann viele Arten gleichsam gänzlich verschwinden. Zu dieser Jahreszeit erreicht dagegen die Vegetation in den tieferen Regionen ihren Höhepunkt.</div> || The text within the template is output with normal line height (or any other line height specified as a valid value), even though the parent {{tag|div|o}} element has another setting.
|-
| {{center|{{samp|…px}}}} || {{tlc|lineheight|height{{=}}30px|At vero eos et accusamus et iusto odio dignissimos ducimus, qui blanditiis praesentium voluptatum deleniti […]}} || {{lineheight|height=30px|At vero eos et accusamus et iusto odio dignissimos ducimus, qui blanditiis praesentium voluptatum deleniti […]}} ||
|-
| {{center|{{samp|…em}}}} || {{tlc|lineheight|height{{=}}3.0em|At vero eos et accusamus et iusto odio dignissimos ducimus, qui blanditiis praesentium voluptatum deleniti […]}} || {{lineheight|height=3.0em|At vero eos et accusamus et iusto odio dignissimos ducimus, qui blanditiis praesentium voluptatum deleniti […]}} ||
|-
| {{center|{{samp|…%}}}} || {{tlc|lineheight|height{{=}}300%|At vero eos et accusamus et iusto odio dignissimos ducimus, qui blanditiis praesentium voluptatum deleniti […]}} || {{lineheight|height=300%|At vero eos et accusamus et iusto odio dignissimos ducimus, qui blanditiis praesentium voluptatum deleniti […]}} ||
|-
| {{center|{{samp|(number)}}}} || {{tlc|lineheight|height{{=}}3|At vero eos et accusamus et iusto odio dignissimos ducimus, qui blanditiis praesentium voluptatum deleniti […]}} || {{lineheight|height=3|At vero eos et accusamus et iusto odio dignissimos ducimus, qui blanditiis praesentium voluptatum deleniti […]}} ||
|-
| rowspan="3" | {{center|{{code|tag}}}} || {{center|{{samp|blockquote}}}} || {{tlc|lineheight|tag{{=}}blockquote|At vero eos et accusamus et iusto odio dignissimos ducimus, qui blanditiis praesentium voluptatum deleniti […]}} || {{lineheight|tag=blockquote|At vero eos et accusamus et iusto odio dignissimos ducimus, qui blanditiis praesentium voluptatum deleniti […]}} ||
|-
| {{center|{{samp|div}}}} || {{tlc|lineheight|tag{{=}}div|At vero eos et accusamus et iusto odio dignissimos ducimus, qui blanditiis praesentium voluptatum deleniti […]}} || {{lineheight|tag=div|At vero eos et accusamus et iusto odio dignissimos ducimus, qui blanditiis praesentium voluptatum deleniti […]}} ||
|-
| {{center|{{samp|p}}}} || {{tlc|lineheight|tag{{=}}p|At vero eos et accusamus et iusto odio dignissimos ducimus, qui blanditiis praesentium voluptatum deleniti […]}} || {{lineheight|tag=p|At vero eos et accusamus et iusto odio dignissimos ducimus, qui blanditiis praesentium voluptatum deleniti […]}} ||
|}

===Incorrect use===
{| class="wikitable" style="background-color: white;"
|-
! Parameter !! Value !! style="width: 200px;" | What you type !! style="width: 300px;" | What you see !! style="width: 200px;" | Comments
|-
|{{center|(none)}} || {{center|Control&nbsp;sample}} || {{code|At vero eos et accusamus et iusto odio dignissimos ducimus, qui blanditiis praesentium voluptatum deleniti […]}} || At vero eos et accusamus et iusto odio dignissimos ducimus, qui blanditiis praesentium voluptatum deleniti […] ||
|-
| {{center|{{code|height}}}} || {{center|Invalid&nbsp;line <br>height&nbsp;values}} || {{tlc|lineheight|height{{=}}fooheight|At vero eos et accusamus et iusto odio dignissimos ducimus, qui blanditiis praesentium voluptatum deleniti […]}} || {{lineheight|height=fooheight|At vero eos et accusamus et iusto odio dignissimos ducimus, qui blanditiis praesentium voluptatum deleniti […]}} || Output with standard line height.
|-
| {{center|{{code|tag}}}} || {{center|Invalid&nbsp;HTML <br>tags}} || {{tlc|lineheight|tag{{=}}footag|At vero eos et accusamus et iusto odio dignissimos ducimus, qui blanditiis praesentium voluptatum deleniti […]}} || {{lineheight|tag=footag|At vero eos et accusamus et iusto odio dignissimos ducimus, qui blanditiis praesentium voluptatum deleniti […]}} || Output in {{tag|span|o}} tags.
|}

==See also==
* {{tl|align}}
* {{tl|resize}}
* {{tl|vertical alignment}}

<includeonly>
<!-- Add categories below -->
[[Category:Text formatting templates]]
</includeonly>