View Categories

Container

Container

The Container Block in Responsive Block is an effective layout element that allows users to group multiple blocks together inside a single parent block.

Container Blocks can be used to build structured layouts, maintain consistent styling, and support responsive design.

How to Add a Container Block

  1. Open the WordPress block editor.
  2. Click the + Add Block button.
  3. Search for Container.
Container block
  1. Insert the block into your page or post.
Choose layout
  1. Add child blocks inside the container to build your layout.
child blocks inside the containe

Container Block Settings

Let’s see some of the container block settings that you get.

General settings container

General Settings

  • Container Width: Choose the width of the container, whether you want it to be full width, boxed or want to customise it.
  • Content Box Width (Desktop): Adjusts the maximum width of the content inside the container.
  • Minimum Height: Sets the minimum height of the container.
  • Equal Height (Toggle): When enabled, all inner elements (child blocks) inside the container are forced to have equal height.
  • HTML Tag: Choose the semantic HTML tag for the container:
  • Overflow: Controls what happens when content inside the container exceeds its boundary.

Flexbox container - Style settings

style Setting

  • Background: Set a solid color, gradient, or image background.
  • Color: Apply global text color for all content inside the container.
  • Border: Add borders around the container.
  • Box Shadow: Apply shadows for depth and emphasis.
  • Shape Dividers: Add decorative shapes (waves, diagonals, etc.) at the top or bottom of the container.
  • Spacing: Control margin (outside space) and padding (inside space).
Updated on December 3, 2025

What are your Feelings

  • Happy
  • Normal
  • Sad

🎉 Use code EXTRA20 to get 20% Off!

Claim 20% Off