- 1.5.0

Stack

Applies a vertical margin between the child elements.

Read more Read less

Maturity: Stable

Usage

<.stack>
  <div>some block</div>
  <div>some other block</div>
</.stack>

By default, the margin is only applied to the direct children of the component. To apply a vertical margin on children at any nesting level, set the recursive attribute.

<.stack recursive>
  <div>
    <div>some nested block</div>
    <div>another nested block</div>
  </div>
  <div>some other block</div>
</.stack>
Default (margin only applied to direct children)
Open in playground

Dogs bring joy and companionship to our lives. Their loyalty and playful nature make them cherished pets in many households.

Training a dog requires patience and consistency. Using positive reinforcement, like treats and praise, helps in teaching commands effectively.

Different breeds have unique traits. For example, Labradors are known for their friendliness, while Border Collies are celebrated for their intelligence. 

<.stack>
  <p>
    Dogs bring joy and companionship to our lives. Their loyalty and
    playful nature make them cherished pets in many households.
  </p>
  <p>
    Training a dog requires patience and consistency. Using positive
    reinforcement, like treats and praise, helps in teaching commands
    effectively.
  </p>
  <p>
    Different breeds have unique traits. For example, Labradors are known
    for their friendliness, while Border Collies are celebrated for their
    intelligence.
  </p>
</.stack>
Recursive (margin applied to nested children)
Open in playground

Training

Training a dog requires patience and consistency. Using positive reinforcement, like treats and praise, helps in teaching commands effectively.

Different breeds have unique traits. For example, Labradors are known for their friendliness, while Border Collies are celebrated for their intelligence. 

<.stack recursive>
  <section>
    <h3>Training</h3>
    <p>
      Training a dog requires patience and consistency. Using positive
      reinforcement, like treats and praise, helps in teaching commands
      effectively.
    </p>
  </section>
  <p>
    Different breeds have unique traits. For example, Labradors are known
    for their friendliness, while Border Collies are celebrated for their
    intelligence.
  </p>
</.stack>