1.8

Pulling an image out of the text flow
When dragged into a template, an image is automatically integrated in the text flow. This means
that it will move up or down, depending on the preceding text.
To position the image independently of the text flow, you can change its position property to
absolute. (For an explanation of all possible values for this property, see
http://www.w3schools.com/css/css_positioning.asp.)
When an image is placed inside a Box (or Div element), changing its position property to
absolute positions the image absolutely inside that Box.
Note that float, the property that can make an image float to the right or left (see "Wrapping text
around an image" on the previous page), is a relative positioning property, since it specifies the
position of the element relative to its container. This means it is incompatible with the
position:absolute property.
In the Formatting dialog (see "Applying local formatting to an image" on page222) the position
property can be found on the Image tab, under Positioning.
The position property isn't present in one of the tab menus of the style rule editor directly, but
you can add it after clicking the Advanced button in the style rule editor (see "Applying style
rules to an image" on page222).
When the position property of an element is set to absolute, the top or bottom and left or
right properties can be used to position the element inside its parent with exact values (pixels
(px), centimeters (cm), etc). Negative values are allowed.
Note
In Web sections, the position property may sometimes be useful for images inside a Div
element, but generally elements should not be positioned absolutely. Designs for the Web should be
flexible so that they display nicely on a variety of devices and screen sizes.
Background color and/or image
In any type of template, boxes, tables and table cells can have a background color and/or a
background image.
To select a background image or color:
Page 224