Managing complex layouts

In this video, you will learn how to manage complex layouts that use one or more overlapping components to display inner sections to your canvas.

Transcription

The template we're replicating in Webround has a newsletter section with a complex design that integrates text components and a newsletter form inside a black container.

To replicate this structure in Webround, we need to use an empty wrapper that will act as a container for other components. As the name suggests, the empty wrapper can't contain anything at all, so we need to integrate text as a normal Webround's text component. We drag and drop it into the container area.

Webround components can be layered on each other at your will. By right-clicking on an element, you'll be able to change the Z-Index property of the specific component. If the text has a Z-Index lower than the one of the empty wrapper, it will not be visible.