Welcome to the new Flexbox preview page

To see how the blocks are built you must open it in the editor.

Flexbox is a super powerful way to lay out elements on a page.  Note that Flexbox in FROONT is still in beta. To extend the functionality edit element's CSS. Have ideas for improvement? Send us an email!

This is a simple layout where the main container has a property Flexbox (Panel / Layout / Flexbox). The image container has a background and the text container has a Flexbox property too.

Hello!

Flexbox brings awesomness back to web design!

The following block has the property Reverse Order set to Reversed (Panel / Layot / Reverse order)

Hello!

Flexbox brings awesomness back to web design!

Here the alignation of the text widget is changed. Feel free to experiment with that! Go to Layout / Flexbox / Vertical and Horizontal align to do so.

Hello!

Flexbox brings awesomness back to web design!

Make sure to check out how each block is acting in the smaller breakpoints! More exampes and documentation is coming soon!