Online School Prebuilt Desconstruction

[WebbSpots]

#3793

Desconstructing this prebuilt info page: https://avada.com/blog/avada-online-school-deconstructing-a-prebuilt-website/
The section we want to concentrate on for this discussion is the stacked postcards about half-way down the home page. This appears similar to Full Height container action but not full height of the screen which creates a nice mid page effect.

The desconstruct info from Avada is as follows:

“This section was built using a Container holding one 20% width Column containing a Button Element and an Image Element, one 52% width Column containing a Title Element and a Text Block Element, and one 28% width Column containing a Button Element.

This is followed by two 1/1 (100% width) Columns, where one is used for spacing and the other contains a Post Cards Element.”

More specifically the Post Card Element is set to Stacking. It is important to note here this postcard is set up to display horizontally rather than a vertical or image only design. This works best for the effect of a collapsing container or column when the postcard is set to stack in a 1/1 row as shown in the prebuilt.

There are many designs possible with stacking postcards. Varing columns and content can make for interesting designs.

[Author]

Posts