Group

The group class is a versatile tool that helps organize and structure your content effectively. By using the group class, you can create cohesive layouts and improve the readability of your content.

Usage

To use the group class, simply add it to a parent container to create a grouping effect.

            
<div class="container">
  <div class="group">
    <!-- Your content goes here -->
  </div>
  <div class="group">
    <!-- Your content goes here -->
  </div>
</div>
            
          

Features

• Flexible Layout: The group class allows for flexible layout options, accommodating various content types.
• Consistent Spacing: Headings within the group have consistent spacing, ensuring readability and visual hierarchy.

Examples

• Basic Group

                  
  <div class="group">
    <h2>Group Heading</h2>
    <p>This is a basic group. It provides structure to your content.</p>
  </div>
                  
                

• Group with Nested Content

                  
  <div class="group">
    <h3>Nested Group Heading</h3>
    <p>This is a nested group within another group.</p>
    <div class="group">
      <h4>Subgroup Heading</h4>
      <p>This is a subgroup within the nested group.</p>
    </div>
  </div>