Difference between revisions of "Template:ClearFloats"
Jump to navigation
Jump to search
imported>Hitbts (created) |
imported>Hitbts m (needed to be a CSS block) |
||
Line 1: | Line 1: | ||
<onlyinclude><span style="clear:both;font-size:0"></span></onlyinclude><noinclude> | <onlyinclude><span style="clear:both;font-size:0;display:block"></span></onlyinclude><noinclude> | ||
When you float an image to the left or right, text will wrap around it; this is pretty standard formatting. Problem is, this effect can't really be ''contained''. If the floated image is underneath a section heading and the image is longer than the content of that section, then content from the next section(s) will also wrap around the image. | When you float an image to the left or right, text will wrap around it; this is pretty standard formatting. Problem is, this effect can't really be ''contained''. If the floated image is underneath a section heading and the image is longer than the content of that section, then content from the next section(s) will also wrap around the image. | ||
This template (<code><nowiki>{{ClearFloats}}</nowiki></code>) allows you to ''clear'' a float: content after the template will be shoved down below the floated content/image, to avoid the wrapping effect. | This template (<code><nowiki>{{ClearFloats}}</nowiki></code>) allows you to ''clear'' a float: content after the template will be shoved down below the floated content/image, to avoid the wrapping effect. | ||
</noinclude> | </noinclude> |
Revision as of 18:44, 13 July 2016
When you float an image to the left or right, text will wrap around it; this is pretty standard formatting. Problem is, this effect can't really be contained. If the floated image is underneath a section heading and the image is longer than the content of that section, then content from the next section(s) will also wrap around the image.
This template ({{ClearFloats}}
) allows you to clear a float: content after the template will be shoved down below the floated content/image, to avoid the wrapping effect.