Adding Panels to a Responsive Container

You can utilize responsive panel in panel behavior by adding items to a panel group container. When you run the page, top-level containers in the page, including the panel group container, fold responsively based on the size of the browser, and the panels within the panel group container fold based on its current size, independent of the rest of the page. Additionally, items in the panel group container are kept together when folding occurs, making the panel group container a good way to group together closely related content that you want to be visually separated from the other items on the page. This is particularly true when related items are arranged vertically, as items typically wrap based on rows.

To create a panel group container, click the Container tab on the sidebar, select the Panel group container, and drag it onto the canvas. You can then resize it like any other container.

To add a panel to a panel group container, drag a new content item or another container from the Container tab on the sidebar into it. You can then resize the new container inside the panel group container. You can also add an existing container on the page to a panel group by holding the Ctrl key and dragging the container into it.

Once you have created it, you can right-click an area of blank space within the panel group to duplicate it, delete the panel group and its contents, or remove the panel group but keep its constituent containers on the page. You can also right-click an item and click Move to canvas to remove it and any other concurrently selected panels from the panel group container. The item is moved to a nearby, empty area of the page. If you selected multiple panels inside a panel group, then they are placed on the canvas near the panel that you right-clicked.

You can also select the panel group and use the Properties panel to add a toolbar and title to the panel group container. Properties applied to the entire page or to the panel group container, such as margins or styling, affect all panels within it, unless specifically overridden.