Difference between revisions of "Template:Clear/doc"
(Created page with "'''{{tl|Clear}}''' adds an empty HTML tag with the {{xt|style {{=}} "clear: both"}} attribute. This forces any following content to start beneath this tag, preventing any cont...") |
|||
Line 7: | Line 7: | ||
== Example == | == Example == | ||
− | <pre>[[File: | + | <pre>[[File:Basic Chemistry.png|200px|left]] |
− | + | Basic Chemistry | |
There's no {{tl|clear}} template before this second line, so it wraps around the image. This is the default wrap behavior for images.{{clear}} | There's no {{tl|clear}} template before this second line, so it wraps around the image. This is the default wrap behavior for images.{{clear}} | ||
− | Note that this text comes after a {{tl|clear}} template, so it is not wrapped around the | + | Note that this text comes after a {{tl|clear}} template, so it is not wrapped around the image for Basic Chemistry. |
− | [[File: | + | [[File:Agriculture.png|200px|left]]Agriculture{{clear}} |
− | This text comes after a {{tl|clear}} template placed after the File link for the | + | This text comes after a {{tl|clear}} template placed after the File link for the image for Agriculture and the last line of text. It will be placed past the bottom of the last line of text and the Agriculture image.</pre> |
renders as: | renders as: | ||
− | [[File: | + | [[File:Basic Chemistry.png|200px|left]] |
Principles of Architecture | Principles of Architecture | ||
There's no {{tl|clear}} template before this second line, so it wraps around the image. This is the default wrap behavior for images.{{clear}} | There's no {{tl|clear}} template before this second line, so it wraps around the image. This is the default wrap behavior for images.{{clear}} | ||
− | Note that this text comes after a {{tl|clear}} template, so it is not wrapped around the | + | Note that this text comes after a {{tl|clear}} template, so it is not wrapped around the image for Basic Chemistry. |
− | [[File: | + | [[File:Agriculture.png|200px|left]]Agriculture{{clear}} |
− | This text comes after a {{tl|clear}} template placed after the File link for the | + | This text comes after a {{tl|clear}} template placed after the File link for the image for Agriculture and the last line of text. It will be placed past the bottom of the last line of text and the Agriculture image. |
<noinclude>[[Category:Template documentation|{{PAGENAME}}]]</noinclude> | <noinclude>[[Category:Template documentation|{{PAGENAME}}]]</noinclude> |
Latest revision as of 22:46, 12 July 2018
{{Clear}} adds an empty HTML tag with the style = "clear: both" attribute. This forces any following content to start beneath this tag, preventing any content above it from wrapping other content around it.
It is commonly used to prevent text wraps between sections on articles with images, and should be used sparingly and with consideration for its effects on both mobile and desktop themes.
Template
{{clear}}
Example
[[File:Basic Chemistry.png|200px|left]] Basic Chemistry There's no {{tl|clear}} template before this second line, so it wraps around the image. This is the default wrap behavior for images.{{clear}} Note that this text comes after a {{tl|clear}} template, so it is not wrapped around the image for Basic Chemistry. [[File:Agriculture.png|200px|left]]Agriculture{{clear}} This text comes after a {{tl|clear}} template placed after the File link for the image for Agriculture and the last line of text. It will be placed past the bottom of the last line of text and the Agriculture image.
renders as:
Principles of Architecture
There's no {{clear}} template before this second line, so it wraps around the image. This is the default wrap behavior for images.
Note that this text comes after a {{clear}} template, so it is not wrapped around the image for Basic Chemistry.
Agriculture
This text comes after a {{clear}} template placed after the File link for the image for Agriculture and the last line of text. It will be placed past the bottom of the last line of text and the Agriculture image.