Template:Clear/doc - Revision history

Mac Fife: Remove redundant icon

2010-02-04T09:43:49Z

Remove redundant icon

Mac Fife at 08:58, 11 March 2009

2009-03-11T08:58:35Z

Mac Fife: New page: {{clear}} clears all existing floats, causing subsequent content to be displayed starting '''below''' the lowest extending floated item. This is used to tidy up layout iss...

2009-02-04T20:24:38Z

New page: <nowiki>{{clear}}</nowiki> clears all existing floats, causing subsequent content to be displayed starting '''below''' the lowest extending floated item. This is used to tidy up layout iss...

New page

<nowiki>{{clear}}</nowiki> clears all existing floats, causing subsequent content to be displayed starting '''below''' the lowest extending floated item. This is used to tidy up layout issues arising from unexpected flow of test around thing like floated images. You can consider this equivalent to inserting an invisible horizontal rule.

For example, a page may be intended to contain two images side by side with text appearing underneath the two. One image is "floated" to the left edge using <code><nowiki>[[Image:Example1.jpg|left]]</nowiki></code> and the other floated to the right edge with <code><nowiki>[[Image:Example2.png|right]]</nowiki></code>, and the text is added to the page below both images. If the browser window is not too wide, then the page will render as expected. However if the browser window width is is increased much beyond the horizontal width of the two images, then the text will start to flow between the images. Inserting <nowiki>{{clear}}</nowiki> after the images and before the text will correct this behaviour.

=== Usage ===

Insert <code><nowiki>{{clear}}</nowiki></code> '''after''' any floated items and '''before''' any content which must "clear" the floats.

← Older revision		Revision as of 09:43, 4 February 2010
Line 1:		Line 1:
−	~~{{info}}~~
	<nowiki>{{clear}}</nowiki> clears all existing floats, causing subsequent content to be displayed starting '''below''' the lowest extending floated item. This is used to tidy up layout issues arising from unexpected flow of test around thing like floated images. You can consider this equivalent to inserting an invisible horizontal rule.		<nowiki>{{clear}}</nowiki> clears all existing floats, causing subsequent content to be displayed starting '''below''' the lowest extending floated item. This is used to tidy up layout issues arising from unexpected flow of test around thing like floated images. You can consider this equivalent to inserting an invisible horizontal rule.

← Older revision		Revision as of 08:58, 11 March 2009
Line 1:		Line 1:
		+	{{info}}
	<nowiki>{{clear}}</nowiki> clears all existing floats, causing subsequent content to be displayed starting '''below''' the lowest extending floated item. This is used to tidy up layout issues arising from unexpected flow of test around thing like floated images. You can consider this equivalent to inserting an invisible horizontal rule.		<nowiki>{{clear}}</nowiki> clears all existing floats, causing subsequent content to be displayed starting '''below''' the lowest extending floated item. This is used to tidy up layout issues arising from unexpected flow of test around thing like floated images. You can consider this equivalent to inserting an invisible horizontal rule.