This article ONLY works when using Avonni Creator. Only customers with an active subscription that was activated on or before December 31, 2021 have access to Avonni Creator.
This article is only valid when working on a Creator project.

Center block elements inside a page

Often times it is useful to be able to center the content of your design in a browser window. By default a block-level (div or container) element always takes up the full width available (stretches out to the left and right as far as it can).

However it's possible to set the width of a block-level element and prevent it from stretching out to the edges of its container.

How to?

1. Use a Div element as a first block-level element

2. Check 'Margin Auto' checkbox from the setting side panel

3. Add your width in px or in % in the Max Width textbox from the DIV setting side panel.

4. Add any elements inside that block-level element

Avonni Designer vs Avonni Builder comparison table

View all the differences between Avonni Designer and Avonni Builder.