Position

The Position property defines how a block should be positioned.

By default, elements are positioned according to their order of arrival in the HTML file.

The first elements encountered are placed at the top of the page and the following ones below.

Location

The Position property is used to set the location of an element on the page, independently of its position in the HTML file: the element can therefore be found anywhere on the page.

The element is then positioned (static, absolute, relative, fixed, sticky)​​.

Static The blocks are positioned one after the other, according to their order in the HTML document and natural flow of the page. The block does not react to the positioning properties.

Absolute The block is positioned in relation to the closest positioned ancestor. If there is no other element positioned, the reference will be the body. The block is positioned and reacts to the positioning properties.

Relative The blocks are positioned one after the other, according to their order in the HTML document and natural flow of the page. The block is positioned and reacts to the positioning properties.

Fixed The block is positioned according to the viewport. The element will therefore not scroll with the page and will be fixed. The block is positioned and reacts to the positioning properties.

Sticky The block scrolls with the page as long as it remains visible. The block is positioned and reacts to the positioning properties.

• Select a block.

• Open the Block Inspector.

• Open the Design tab.

• Open the Layout tab.

• Open the Position tab.

• Select the appropriate location option (static, absolute, relative, fixed, sticky)​​.

Values

Available for all positions except static.

You can specify the top, right, bottom and left values to allow you to define the location of an element.

• Select a block.

• Open the block inspector.

• Open the design tab.

• Open the layout tab.

• Open the position tab.

• Enter the desired values (Top, Right, Bottom, Left).

• Click dot to reset.