Defining CSS style positioning properties

The Positioning style attributes change the tag or block of selected text into a new layer using the default tag for defining layers as set in the Layer preferences. (See Setting layer preferences and properties.)

To set the layer positioning attributes:

1. Open the CSS Styles panel (Shift+F11), if it isn’t already open.
2. Open the CSS Rule Definition dialog box by doing one of the following:
   • Add a new style. For detailed information, see Creating a new CSS rule.
   • Select an existing style, right-click to display the content menu, and select Edit to open it for editing.
   • Select an existing style and click the Edit Style button located in the lower-right corner of the CSS Styles panel.
3. In the CSS Rule Definition dialog box, select Positioning, and then set the style attributes you want.

   Leave any of the following attributes empty if they are not important to the style:

   Type determines how the browser should position the layer as follows:

   Absolute places the layer using the coordinates entered in the Placement boxes relative to the upper-left corner of the page.

   Relative places the layer using the coordinates entered in the Placement boxes relative to object’s position in the text flow of the document. This option is not displayed in the Document window.

   Static places the layer at its location in the text flow.

   Visibility determines the initial display condition of the layer. If you do not specify a visibility property, by default most browsers inherit the parent’s value. Select one of the following visibility options:

   Inherit inherits the visibility property of the layer’s parent. If the layer has no parent, it will be visible.

   Visible displays the layer contents, regardless of the parent’s value.

   Hidden hides the layer contents, regardless of the parent’s value.

   Z-Index determines the stacking order of the layer. Higher numbered layers appear above lower-numbered layers. Values can be positive or negative. (It’s easier to change the stacking order of layers using the Layers panel. See Changing the stacking order of layers.)

   Overflow (CSS layers only) determines what happens if the contents of a layer exceed its size. These properties control how this expansion is handled as follows:

   Visible increases the layer’s size so that all of its contents are visible. The layer expands down and to the right.

   Hidden maintains the layer’s size and clips any content that doesn’t fit. No scroll bars are provided.

   Scroll adds scroll bars to the layer regardless of whether the contents exceed the layer’s size. Specifically providing scroll bars avoids confusion caused by the appearance and disappearance of scroll bars in a dynamic environment. This option is not displayed in the Document window and works only in browsers that support scroll bars. Supported by Internet Explorer and Netscape Navigator 6.

   Auto makes scroll bars appear only when the layer’s contents exceed its boundaries. This option is not displayed in the Document window.

   Placement specifies the location and size of the layer. How the browser interprets the location depends on the setting for Type. Size values are overridden if the content of the layer exceeds the specified size.

   The default units for location and size are pixels. For CSS layers, you can also specify the following units: pc (picas), pt (points), in (inches), mm (millimeters), cm (centimeters), (ems), (exs), or % (percentage of the parent’s value). The abbreviations must follow the value without a space: for example, 3mm.

   Clip defines the part of the layer that is visible. If you specify a clipping region, you can access it with a scripting language such as JavaScript and manipulate the properties to create special effects such as wipes. These wipes can be set up by using the Change Property behavior.

4. When you are finished setting these option, select another CSS category on the left side of the panel to set additional style attributes, or click OK.