Template:Vertically align image with text

Lorem ipsum dolor sit amet, consectetur adipiscing 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.

[edit] [purge]

Template documentation

This documentation is transcluded from Template:Vertically align image with text/doc. (edit | history)
Editors can experiment in this template's sandbox (create) and test cases (create) pages.
Subpages of this template.

Description

Vertically aligns an image with a body of text.

Note: Buggy or doesn't work with IE, Firefox <= 27, Chrome <= 20, Safari <= 6.1. Compatibility chart for flex containers.

Usage

{{Vertically align image with text|text=text|image=image|float=float}}
{{Vertically align image with text|text=text|image=image|float=float|list=yes}}

Where text is arbitrary text, image contains the image, and float can be left or right. |list=yes prefixes the output with a wiki bullet to fix usage in a list.

Examples

Example 1

Floating left in a list

* {{Lorem ipsum}}
* {{Vertically align image with text|float=left|list=yes}}
* {{Lorem ipsum}}

Lorem ipsum dolor sit amet, consectetur adipiscing 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 adipiscing 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 adipiscing 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.

Example 2

Floating right

{{Lorem ipsum}}
{{Vertically align image with text|float=right}}
{{Lorem ipsum}}