Floating containers are content containers, like columns, that can be attached to any one component on the page and be positioned in relation to one of that component’s corners.
How To Add
- Open the Layout menu on the left sidebar
- Click and drag the Floating Container onto your layout
- Drop to attach it to any one component, an orange area will guide you
By default, the Floating Container will attach to the top left corner of the component.
Positioning
You can drag the floating container around to change its position manually, but for precise positioning, you must:
- Right-click the floating container to open its context menu
- Open the Anchor Settings menu
- Click on one of the four circles to bind the floating container to a corner
- Change the Vertical and Horizontal values and units to precisely position the floating container in relation to the corner it is bound to
Resize The Floating Container
You can resize a floating container manually by:
- Mouseover the Floating Container
- Click and drag the triangle that appears on its bottom right corner
or, for all the options and also for precision:
- Right-click the floating container to open its context menu
- Open the Container Style menu
- Change the Width and Height values and their units
Tip: to get a floating container to completely cover any one component, attach it to the very top left corner of that component, and set width and height to 100%
Anchor To Another Component
- Right-click the floating container to open its context menu
- Click the Anchor to… option
- Click on the component you want it to attach to, an orange area will guide you