Template:Easy CSS image crop 2/doc

This is an earlier form of Template:Easy CSS image crop that uses pixel sizes for the crops instead of percentages, which is a little unintuitive when the base image you're cropping from changes based on the desired end width.

<syntaxhighlight lang="wikitext">

<div class="thumbinner" style="width: px;"> <div class="thumbimage" style="width: How wide the image should be after cropping.px; height: px; overflow: hidden;">

<div style="position: relative; top: -px; left: -px; width: px">

[[File:The Name of the image file, or may accept

[[File:{{{image}}}|300px|alt=|{{{caption}}}]]

{{{annotations}}}

[[Image:{{{image}}}|300px|frameless|alt=]]

{{{caption}}}

.|px|alt=The alt text for the image.|link=Name of an article to be linked by clicking on the image (omit unless there is a good reason to link to an article instead of the image).|page=The page of the file, if there are multiple pages (such as pdf files).]]

[[:The image to be linked by the magnify icon (Use if the Image parameter is set to

[[File:{{{image}}}|300px|alt=|{{{caption}}}]]

{{{annotations}}}

[[Image:{{{image}}}|300px|frameless|alt=]]

{{{caption}}}

or the Link parameter leads to something other than the image).| ]]

Description (will render out using thumbnail class)

</syntaxhighlight>

For the crop parameters, note that since we're going for a desired width, the size of the image being cropped from will vary depending on what crop_left and crop_right are set to. As such, these should be set before playing with crop_top and crop_bottom. All default to 0, which means nothing is cropped from that side.