See Also
This panel of the the Style
Editor enables you to add position-related cascading style
sheet (CSS) declarations to the style property of a JavaServer
Faces component. The declarations you add to the style property
override corresponding CSS rules defined in the page's CSS file.
- Note: The Visual Designer by default is in grid mode. In that mode, the Visual Designer sets the
position CSS property to absolute in each component's style property. If you change the position value in this dialog and then move the component in Visual Designer while the editor is in grid mode, the Visual Designer will reset position to absolute.
The Position panel enables you to set the following style declarations:
- Position. Sets the CSS property position, which determines
where the component is displayed on the page. Takes one of the following values:
- Absolute. The component is positioned relative to its containing
block. The positioning is a set distance from the edges of the containing
block and depends on the settings of the positioning properties Top,
Bottom, Left, and Right.
- Static. The component is positioned relative to its parent and
to other components that precede it. None of the positioning properties
(Top,
Bottom, Left, and Right) apply.
- Relative. The component is positioned a specified distance away
from its normal position without respect to the positioning of other
elements, meaning that it can overlap other elements. The positioning
depends on the settings of the positioning properties Top, Bottom, Left,
and Right.
- Fixed. The component is positioned relative to the browser
window and does not move when other elements are scrolled. The positioning
depends on the settings of the positioning properties Top, Bottom, Left,
and Right.
- Inherit. The component inherits the position setting of its
parent component.
- Note: If you enter a number in any of the following fields and the field has a
disabled drop-down list next to it for setting numeric units, press the Enter
key after entering the number to enable the drop-down list.
- Top. Sets the CSS property top, which determines how
far from the top of the containing block the component is to be positioned.
This setting does not apply if Position is set to static.
- Bottom. Sets the CSS property bottom, which determines
how far from the bottom of the containing block the component is to be positioned.
This setting does not apply if Position is set to static.
- Left. Sets the CSS property left, which determines
how far from the left of the containing block the component is to be positioned.
This setting does not apply if Position is set to static.
- Right. Sets the CSS property right, which determines
how far from the top of the containing block the component is to be positioned.
This setting does not apply if Position is set to static.
- Width. Sets the CSS property width, which determines the
width of the component if Position is set to Absolute.
- Height. Sets the CSS property height, which determines
the height of the component if Position is set to Absolute.
- Visible. Sets the CSS property visible, which determines
if the component can be seen on the rendered page.
- Z-Index. Sets the CSS property z-index, which determines
the stack order of the component: whether
the component displays on top of or behind other components. A negative value
puts the component behind its containing block.
- Clip. Sets the CSS property clip:rect, which defines a
clipping rectangle that makes the parts of the component between the component's
border and edges of the clipping rectangle transparent, effectively clipping,
or cutting off, parts of the rendered component.
- See Also
- About Components
- Common
Component Properties
- Using
Cascading Style Sheets
Close