Seventh > Blocks > Content group

Content group

The Content group block groups multiple blocks together for layout control.

What it does

This block displays:

Block settings explained

Direction

  • Horizontal alignment flex-direction:row
  • Vertical alignment flex-direction:column

Gap

  • Spacing between the inner blocks

Vertical alignment (only when the direction is horizontal)

  • How to vertically align items that have different heights

Horizontal alignment (only when the direction is horizontal)

  • How to horizontally align items when their size is smaller than 100%
  • Overflowing content will always break into the new line if there isn't enough space

Common Use Cases

  • Aligning text and buttons
  • Building compact card layouts

Tips for Success

  • Use groups to keep spacing consistent
  • Keep groups small and focused
Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.