logo

Air CSS ver. 2.3.2

Position

The position sets how an element is positioned in a document. This module should be used in conjunction with the coordinates module.

Mnemonics

Bases
Modifiers
Optional extensions
fixed
absolute
relative
sticky

none
-m = medium
-l = large

Description

.fixed

When fixed, the element is removed from the normal document flow, and no space is created for the element in the page layout. The element is positioned relative to its initial containing block, which is the viewport in the case of visual media.

.aboslute

Absolute elements are absolutely positioned inside of a relative element. You can use absolute positioning to stretch elements making sure they fill the width and height of a relative container.

.relative

Relatively positioned elements offer the ability to offset the position of an element without affecting the position of any elements around it.

.sticky

Sticky elements are positioned normally in the document flow, and then offset relative to its nearest scrolling ancestor and containing block.

Source code

/* generate: container-rule */
.fixed { position: fixed; }
.absolute { position: absolute; }
.relative { position: relative; }
.sticky { position: sticky; }
/* end generate */