please dont rip this site
Positioning Properties

clip
Value: <shape> | auto
<shape>: rect (<top> <right> <bottom> <left>)
<top> <right> <bottom> <left>: auto | <length>
Initial: auto
Applies to: elements with the 'position' property of type 'absolute'.
Inherited: no
Percentage values: N/A

Clipping alters the display of HTML, though it does not affect how it is laid out. The clipping region defines what portion of the element's physical representation is visible. It is computed by the intersection of the parent's clipping region with the value of the element's 'clip' property.

Lengths are specified with respect to the element's top-left corner. Negative values are permitted. When converted to pixel coordinates, the bottom-right corner is excluded from the clipping rectangle. This rule is necessary to permit the definition of zero-width or zero-height rectangles.

Any length can be replaced by the value 'auto', which causes the respective extent of the clipping rectangle to match the element's extent in the given direction, including padding, borders and child elements. The default value for the 'clip' property causes the clip rectangle to encompass the entire element. In effect, 'auto' provides for an infinite clipping region.

For now, all clipping regions are rectangular. We anticipate future extensions to permit non-rectangular clipping.

Note: If the clipping region exceeds the bounds of the browsers document window, contents may be clipped to that window by the native operating environment.

width, height
Value: <length> | <percentage> | auto
Initial: auto
Applies to: block-level and replaced elements, elements with 'position' property value of 'absolute'
Inherited: no
Percentage values: refer to parent element's width and height. If parent's height is 'auto', percentage of height is undefined.

For elements with 'position' of type 'relative' and 'static', the behavior of 'width' and 'height' is unchanged from that defined by the CSS1 formatting model.

For 'absolute' positioned elements:

left, top
Value: <length> | <percentage> | auto
Initial: auto
Applies to: elements with the 'position' property of type 'absolute' or 'relative'.
Inherited: no
Percentage values: refer to parent element's width and height. If parent's height is set to 'auto', percentage is undefined.

For elements with 'absolute' positioning, 'left' and 'top' are based on the current positioning context.

For elements with 'relative' positioning:

overflow
Value: visible | hidden | scroll | auto
Initial: visible
Applies to: elements with the 'position' property of type 'absolute'.
Inherited: no
Percentage values: N/A

'Overflow' determines what happens when an element's rendered contents exceed its height or width.

A value of 'visible' indicates that the element's bounding box should be enlarged enough to contain all of its rendered contents. In other words, its height or width can be made bigger than the declared value. Any padding or border will remain outside the rendered content. Any additional width will be added in the direction of primary text flow, e.g. to the right side in left-to-right languages, while additional height will be added to the bottom.

A value of 'hidden' indicates that the element's contents should be clipped to its height and width, and that no scrolling mechanism should be provided. Padding and border will be applied to the regular height and width of the element, as if its contents did not exceed its bounds. Any contents that exceed the element's bounds will be unavailable to the user.

The behavior of the 'auto' value is browser-dependent, but should cause a scrolling mechanism to be invoked when the element's rendered contents exceed its bounds.

Finally, the 'scroll' value indicates that if the UA supports a visible scrolling mechanism, that mechanism should be displayed whether or not the element's rendered contents exceed its bounds. This avoids any problem with scrollbars appearing and disappearing in a dynamic environment.

Note: Even if 'overflow' is set to 'visible', contents may be clipped to a UA's document window by the native operating environment. In addition, the 'clip' property can cause otherwise visible "overflowed" contents to be clipped.

The default value ('auto') represents the current position in the document at the time the element is rendered. This value is calculated by the UA for 'absolute' positioned elements, and is 0 (no offset) for 'relative' positioned elements.

position
Value: absolute | relative | static
Initial: static
Applies to: all elements
Inherited: no
Percentage values: N/A

Each variety of 'position' establishes one or more of the following:

'Absolute' Positioned elements act like block-level elements from a CSS1 formatting perspective. However, since they fall completely outside of the normal document flow, the following CSS1 properties do not apply: 'float', 'clear', 'margin-top', 'margin-right', 'margin-bottom', 'margin-left', 'margin'.

visibility
Value: inherit | visible | hidden
Initial: inherit
Applies to: all elements
Inherited: if value is 'inherit'

Visibility determines the initial display state of an element, but does not affect its layout. Elements that are hidden still take up the same physical space as they would were they visible, they are just rendered transparently. This differs from the behavior of 'display: none', in which the element is ignored, as if it were not present in the document at all. Visibility can be used in a scripting environment to dynamically display only one of several elements which overlap one another.

z-index
Value: auto | <integer>
Initial: auto
Applies to: positionable elements
Inherited: no
Percentage values: N/A

The 'z-index' property is used to specify the stacking order of positionable elements. The default ('auto') behavior is to stack them bottom-to-top in the order they appear in the HTML source within the current positioning context. The 'z-index' property allows an element's z-order to be given as an integer that specifies stacking order relative to its positionable sibling and parent elements:

The relative z-order of two elements that are neither siblings nor parent/child can be determined by evaluation of the above rules for both elements' ancestors.

See also:


file: /Techref/language/html/ib/Style_Sheets/pospro.htm, 9KB, , updated: 2004/3/1 15:47, local time: 2017/11/22 08:27,
TOP NEW HELP FIND: 
54.225.16.10:LOG IN

 ©2017 These pages are served without commercial sponsorship. (No popup ads, etc...).Bandwidth abuse increases hosting cost forcing sponsorship or shutdown. This server aggressively defends against automated copying for any reason including offline viewing, duplication, etc... Please respect this requirement and DO NOT RIP THIS SITE. Questions?
Please DO link to this page! Digg it! / MAKE! / 

<A HREF="http://techref.massmind.org/techref/language/html/ib/Style_Sheets/pospro.htm"> Positioning properties</A>

After you find an appropriate page, you are invited to your to this massmind site! (posts will be visible only to you before review) Just type in the box and press the Post button. (HTML welcomed, but not the <A tag: Instead, use the link box to link to another page. A tutorial is available Members can login to post directly, become page editors, and be credited for their posts.


Link? Put it here: 
if you want a response, please enter your email address: 
Attn spammers: All posts are reviewed before being made visible to anyone other than the poster.
Did you find what you needed?

 

Welcome to massmind.org!

 

Welcome to techref.massmind.org!

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

  .