Template:Clear

From RRU Knowledge Base
Revision as of 03:56, 2 December 2017 by Jessietail (talk | contribs)
(diff) ← Older revision | Latest revision (diff) | Newer revision → (diff)

This template inserts a <div style="clear:both;"></div> block wherever it's placed. This prevents all text below the template from wrapping and forces it to display entirely after any images above the template. This can be used to stop text from flowing next to unrelated images, or to keep page formatting clean at resolutions different than what the article was written for.

Usage instructions

To use this template, add the tag {{clear}} prior to the text intended to clear.

Optionally, a parameter can be added and set to either left or right to only have it clear that side, inserting a <div style="clear:left;"></div> or <div style="clear:right;"></div> block respectively.

To use this template in this way, add the tag {{clear|left}} to clear the left side, or {{clear|right}} to clear the right side.

Example without {{clear}}

This paragraph is an example paragraph that is not long enough to extend to the bottom of the example image to its left. This will result in the section immediately following this paragraph to display next to the image, despite not being related to the image.

New section without template

See how this sentence starts next to the image?

Example with {{clear}}

This paragraph is an example paragraph that is not long enough to extend to the bottom of the example image to its left. This will result in the section immediately following this paragraph to display next to the image, despite not being related to the image.

{{clear}}

New section with template

See how this sentence starts below the image?

Example with {{clear|right}}

Baz?

Two images!

{{clear|right}}

This paragraph is starting immediately after an instance of {{clear|right}}. You can see that this new text now clears the smaller image on the right, but not the larger image on the left.