| position |
static, relative, absolute, fixed, sticky |
Specifies the positioning type for an element.
static: Default positioning; follows the normal document flow.relative: Positioned relative to its normal position.absolute: Positioned relative to its nearest positioned ancestor.fixed: Positioned relative to the viewport; remains fixed even when scrolling.sticky: Acts like a combination of relative and fixed; becomes fixed within a specific scroll range.
|
<div style="position: relative;">... |
| top, right, bottom, left |
auto, length, percentage |
Specifies the offset of an element from its normal position.
auto: Default value; element remains in its normal position.length: Sets the offset using a fixed length value (e.g., pixels).percentage: Sets the offset using a percentage of the containing element’s dimensions.
|
<div style="top: 10px; left: 20%;">... |
| z-index |
auto, number |
Specifies the stacking order of positioned elements.
auto: Default value; elements are stacked based on their order in the document flow.number: Sets the stacking order explicitly; elements with higher values appear on top.
|
<div style="z-index: 2;">... |
| display |
block, inline, inline-block, none |
Specifies the display behavior of an element.
block: Element generates a block-level box.inline: Element generates an inline-level box.inline-block: Element generates a block-level box that participates in the inline formatting context.none: Element is not displayed; effectively removes it from the document flow.
|
<div style="display: inline-block;">... |
| float |
none, left, right |
Specifies whether an element should float to the left or right of its containing element.
none: Default value; element does not float.left: Element floats to the left of the containing element.right: Element floats to the right of the containing element.
|
<div style="float: right;">... |
| clear |
none, left, right, both |
Specifies whether an element should be pushed below floated elements.
none: Default value; element does not clear any floated elements.left: Element clears floated elements that are to the left.right: Element clears floated elements that are to the right.both: Element clears floated elements on both sides.
|
<div style="clear: both;">... |