What are parent and child boxes?
Site layouts in Studio.Design use a "box model," where boxes are stacked together to build your design.
When you place one box inside another, the two boxes form a parent-child (nested) relationship.
The box that contains another box is called the "parent box."
The box placed inside another box is called the "child box."
A single parent box can contain multiple child boxes. You can also place more boxes inside a child box to create deeper levels of nesting.
Structuring your site this way lets you build complex, flexible layouts.
How to nest a box inside another to create a parent-child relationship
There are three ways to nest one box inside another to create a parent-child structure.
Dragging directly on the screen
Drag the box you want to make a child box into the box you want to be the parent.
Make sure the orange shadow indicating the drop location appears inside the parent box, then release.
Tip: If you want to nest a child box inside a smaller parent box, hold the Shift key while dragging.
Using the Layers panel
In the left navigation, click the Layers panel
.Drag the layer of the box you want to make a child box, and drop it onto the layer of the box you want to be the parent.
Inserting from the Add panel
Select the parent box on the screen or in the Layers panel.
Hold Shift and click an element in the Add panel
on the left side of the screen.
How to check parent-child relationships between boxes
You can check the parent-child relationships of elements in the Layers panel on the left side of the screen.
