Container Layout Item – PageCells Responsive Framework

Containers allow you to group multiple Layout Items together and style them as a single unit. Like the other Layout Items, Containers appear as blue dashed boxes on the Theme Options page.

Adding Containers

From the Layout Items panel on the top right of the Theme Options page, drag the Container Icon over to the Row, Loop or other Container where you want it to appear.

Positioning Containers

Once a Container is added, you can drag the Container to change its position on the Theme Options page. Containers can be dragged across Rows or simply repositioned in the same Row.

The Container Drop Zone appears as a purple dashed box inside the Container blue dashed box outline.
You can drag other Layout Items, including other Containers, into its Drop Zone and their widths will adjust to the width of the Container.

Deleting Containers

Click the red Trash Can Icon on the right side of the Container to delete it. An alert will appear to confirm that is really what you want to do.

Container Options

Click the blue Wrench Icon next to the Container Name to open the Container Options panel.

Container Name

The Container name is used to identify the Container on the Theme Options page. It has no other purpose except to make the Container easier to find on the Theme Options page.


You can reuse Layout Items from another Container by selecting it from the Copy menu. This Container will appear with the selected Container’s name and “(copy)” in its label on the Theme Options page.

Container CSS

Click the green Paintbrush Icon next to the Container Name to open the Container CSS panel. Containers use the same Fluid Cell System classes as other Layout Items as well as the Clearfix and Flush classes.


This style forces the Row to clear any floated items it contains. This ensures that any background styles can be rendered, and keeps other items from being affected by floated items inside the Row. This style is ENABLED by default.


This style removes the automatic margins from any items it contains so that they meet each other with no space between them horizontally or vertically. This style is DISABLED by default.