Genesis Blocks

Create effective content faster.

You are here: Home / Spacer Block

Spacer Block

The Spacer block allows you to easily add an adjustable-height spacer between other blocks. This block also includes an optional divider that includes settings to change the height, color, and style of the divider.

Settings in the Spacer block

Click image to enlarge

  1. Spacer Height: Adjust the height of the spacer so there’s enough space between the blocks above and below it.
  2. Add Divider: Click the toggle to enable the display of a visible divider line in the middle of the space.
  3. Divider Style: Choose whether the divider will be a solid, dashed, or dotted line. This option only shows if the divider is enabled.
  4. Divider Height: Adjust the height, or thickness, of the divider. This option only shows if the divider is enabled.
  5. Divider Color: Click the colored circles to select a pre-defined divider color. Or click Custom Color to select your own.This option only shows if the divider is enabled.
  6. Additional CSS Class(es): You can add one or more CSS class to customize the appearance of the spacer. After adding the class name(s) here, you can enter your custom CSS code in Appearance > Customize > Additional CSS.