1. Home
  2. The Editor
  3. Basics
  4. Floating Containers
  1. Home
  2. The Editor
  3. Floating Containers

Floating Containers

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

  1. Open the Layout menu on the left sidebar
  2. Click and drag the Floating Container onto your layout
  3. 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:

  1. Right-click the floating container to open its context menu
  2. Open the Anchor Settings menu
  3. Click on one of the four circles to bind the floating container to a corner
  4. 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:

  1. Mouseover the Floating Container
  2. Click and drag the triangle that appears on its bottom right corner

or, for all the options and also for precision:

  1. Right-click the floating container to open its context menu
  2. Open the Container Style menu
  3. 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

  1. Right-click the floating container to open its context menu
  2. Click the Anchor to… option
  3. Click on the component you want it to attach to, an orange area will guide you

How To Work With Rows And Columns

Updated on May 3, 2019

Was this article helpful?

Related Articles