Positioning Schemes

There are three positioning schemes, and they are:

• Floats
• Absolute positioning
• Normal flow

Floated content is defined as any element that has a CSS float property of ‘left’ or ‘right’. Note that these values may be inherited with the ‘inherit’ value.

Absolutely positioned elements consist of any element that has a CSS position property of either ‘absolute’ or ‘fixed’. That’s it.

Everything else falls under the category of ‘normal flow’. To be more specific, this category consists of any block that participates in the inline formatting or block formatting contexts, or any block that is positioned relatively. The spec also mentions boxes with the ‘run-in’ display property.

It’s worth mentioning that an element with the display property of ‘inline-block’ falls under the block formatting context.

Positioning schemes are not to be confused with the CSS position property.

Advertisement