Inserting and Formatting Text > Using CSS style sheets > Style Definition Positioning panel

Style Definition Positioning panel

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 Layers preferences.) These attributes only work when used as a custom class and are only supported by IE. Unless you've changed this setting, Dreamweaver uses the div tag. See also Using CSS style sheets and Editing an external CSS style sheet.

To open the Style Definition dialog box, choose Window > CSS Styles and click the Open Style Sheet icon. (You can also select Edit Style Sheet or New Style from the Style pop-up menu.) In the dialog box that appears, choose a style and click Edit. Click Positioning on the left side of the dialog box. 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 top 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.

	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. Browsers often expand text so that is much larger than it appears in the Dreamweaver Document window. These properties control how this expansion is handled.

	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 IE but not Netscape.
	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 timelines and the Change Property behavior.