Image margins

This article explains how to use the margin element in images and images definitions.

The Image definitions and img elements both have an optional "margin" property which specifies the height of the margin around the image.

Note that the margin around an image is only used for an image which is alone in its line. The possible values are:

• No margin
• Small margin (the default value)
• Large margin

Usage of margin in the image definition

The "margin" property for the image definition can have the following values:

• "false", "no", or "noMargin": no margin
• "true" or "small": small margin (the default)
• "large": large margin

By default, all the img elements using this definition will use the margin specified for the definition.

For example:

  <images>
    <image id="image1" url="hand.png" width="30%" margin="large" />
    <image id="image2" url="warning.png" width="30%" margin="no" />        
  </images>

Usage of margin in the image element

The "margin" property for the img element can have the following values:

• "false", "no", or "noMargin": no margin
• "inherit": inherit the value from the associated image definition (the default)
• "true" or "small": small margin
• "large": large margin

By default, all the img elements using this definition will use the margin specified for the definition.

For example:

  <article desc="My article">
    <img id="image1" margin="large" />
  </article>

Examples

Image with a default margin

  The line before
  <img id="imgmargin" />
  The line after

The line before

The line after

Image with no margin

  The line before
  <img id="imgmargin" margin="no"/>
  The line after

The line before

The line after

Image with a large margin

  The line before
  <img id="imgmargin" margin="large"/>
  The line after

The line before

The line after