component

Block

The block element is a spacer tool. It creates consistency margin between HTML
elements no matter the element or its order.

With block

  <p class="block">Text within a block</p>
  <p class="block">Text within a second block</p>
  <p class="block">Text within a third block but no margin at the bottom</p>

Text within a block

Text within a second block

Text within a third block but no margin at the bottom

### Without block

  <p>Text with no block</p>
  <p>Text with no block</p>
  <p>Text with no block</p>

Text with no block

Varibables

  :root {
    --block-bottom-space: var(--space-xs, 1.25rem);
  }