Template:Float left

{{{1}}}

Template documentation[view] [edit] [history] [purge]

This template uses a <span> element for formatting.
Block-based templates and paragraph breaks cannot be nested inside it.

See H:DIVSPAN for details.

This template uses TemplateStyles:

Template:Float left/styles.css

Usage

This template floats text to the left without changing the alignment, and allows remaining text on page to wrap around the text.

{{float left|'''This text is floated left with no offset.'''}} This text is outside the floated span.

yields

This text is floated left with no offset. This text is outside the floated span.

Obviously the effect is not striking without an example (see below)

With margins

1st 1 The text to float to the left.
2nd 2 sets the margin (gap) to the right of the floated text to the designated measure.
3rd 3 sets the top and bottom margin of floated text to the designated measure

{{float left|'''This text is floated left, with no offset, though with an equal top and bottom margin of 4em, and a right margin of 3em.'''|3em|4em}} This text is outside the floated span.

yields

This text is floated left, with no offset, though with an equal top and bottom margin of 4em, and a right margin of 3em. This text is outside the floated span.

Either margin parameter may be used without the other:

{{float left|'''This text is also floated left, with an equal top and bottom margin of 1em but no right margin.'''||1em}} This text is outside the floated span.

yields

This text is also floated left, with an equal top and bottom margin of 1em but no right margin. This text is outside the floated span.

whereas

{{float left|'''This text is floated left with no offset and with a right margin of 18em.'''|18em}} This text is outside the floated span.

yields

This text is floated left with no offset and with a right margin of 18em. This text is outside the floated span.

Example

left aligned	float left	float left with additional margin
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. This text is left aligned Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.	Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. This text is floated left using {{float left}}. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.	Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. This text is floated left using {{float left\|3em\|5em}}. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Usage

With margins

Example

See also