Container

A Container or multiple container blocks can be added inside a section.

Some content such as backgrounds and images can break out of the container width but most content will be inside.

The inner container defines the website content width and is centered on the page.

A .cc-cntr class is added by default and applies a maximum width of 1366px.

By default, when adding a Cwicly Section a container block is automatically inserted inside.

Additional Container blocks can be added inside the Section and the original container can be removed if required.

Add

A container can be added to a container by using the Quick Inserter or the Block Inserter.

  • Click the Container icon in the Quick Inserter to add a Container block to your page.

  • Alternately, search for the Container block in the Block Inserter and click to add inside your section.

Global Settings

  • In the Block tab, open the Container tab.

  • Click the "+" icon to add Container settings.

  • Click the Container field to open the Container settings.

  • Customise the Global container settings as required.

  • For instance, you can modify the Max Width as required.

Add CSS class to container

From Global Styles, you can add a CSS class to add specific styles to a container.

In the Block tab of the Elements tab of the Global Styles tab, open the Container tab.

  • Click the "+" sign to add a new class.

  • Input a meaningful container name and class name.

  • Style as required, in this case we have given it a black background.

  • Select the Container to which you wish to apply the class and styles you have created.

  • Click the "+" sign to add a class.

  • Find the class you created in the Classes modal and click "Enter" to apply.

Last updated