Template:Transform

Documentation The documentation below is transcluded from Template:Transform/doc. (edit | history)

[purge]

This template is used to transform content using CSS. It supports horizontally flipping, vertically mirroring, and rotating the content, in any order. The content can be an image, template, text, or any other wikitext, although the template is mainly intended to transform images, or templates that display images alone.

The transformation happens at the center of the whole object and its effective dimensions will retain the original values of the object as if untransformed, so the position and padding may be adjusted to avoid unwanted overlapping.

Note that this template does not support Internet Explorer 8 or even older browsers, as that requires cumbersome calculating of matrices.

Usage

{{ transform | <content> | flip = y/yes | mirror = y/yes | rotation = <degrees> | scale = <factor> | display = <CSS display property> | style = <additional custom styling> }}

First unnamed parameter

Element to be transformed.

flip

Flips element horizontally.

mirror

Mirrors element vertically.

rotation

Rotation in degrees (clockwise). For best results, use only 90, 180, and 270 degree rotations.

scale

Scales the image. 1 is normal size, 0.5 half size, etc.

display

CSS display property, defaults to inline-block.

style

Additional custom styling if required, applied before the transformations.

Examples

Code	Result
{{transform|[[File:Megashark.png]]|mirror=y}}
{{transform|{{item|mode=image|Guide}}|rotation=90}}
{{transform|{{important}}|flip=y}}	Important: No note provided.
{{transform|{{3DS version}}|mirror=y}}	Nintendo 3DS version
{{transform|[[Tree]]|rotation=90}}	Tree
{{transform|[[File:Dryad.png]]|flip=y}}
{{transform|[[File:Dryad.png]]|flip=y|mirror=y}}
{{transform|[[File:Dryad.png]]|flip=y|mirror=y|rotation=30}}
{{transform|[[File:Dryad.png]]|flip=y|rotation=30|mirror=y}}
{{transform|{{item|mode=image|Guide}}|scale=0.5}} {{transform|{{item|mode=image|Guide}}|scale=1}} {{transform|{{item|mode=image|Guide}}|scale=1.5}}