Flexible Spacer Block
Add white space between blocks and customize its height for each device.
The facts
- Rating
- 5★ from 8
- Active installs
- 4k+
- Price
- Free
- Last updated
- 28 Jul 2026
- Added
- Jan 2021
- Requires WP
- 7.0
- Tested up to
- WP 7.1
- Requires PHP
- 8.0
- Downloads
- 45,420
Our analysis
AI-assistedFlexible Spacer Block is a WordPress plugin that allows you to adjust the height of spacers based on device screen width. It features two variable breakpoints for smartphones, tablets, and desktops, enabling individual or batch height adjustments. Additionally, it supports negative space, allowing for overlapping blocks if configured correctly.
This plugin is suitable for users who want more control over the spacing in their Gutenberg block editor layouts, particularly those looking to create responsive designs that adapt to different screen sizes.
Best for: This plugin suits users looking to enhance their WordPress site's layout with responsive spacing options.
What it does well
- ✓Adjusts spacer height according to device screen width
- ✓Supports individual or batch height adjustments
- ✓Allows for negative space to create overlaps
- ✓Transforms from and to core spacer block
Where it falls short
- •Limited information on advanced features and usage
- •Requires knowledge of CSS for certain functionalities
Verdict
Flexible Spacer Block offers a practical solution for managing spacers in a responsive manner, though some technical knowledge may be needed for full utilisation.
From the developer
Aki Hamano's own description of Flexible Spacer Block, lightly tidied.
Flexible Spacer Block switches the height of the spacer according to the device screen width (breakpoints).
This block has two variable breakpoints, and you can adjust the height of the spacer for smartphones, tablets, and desktops respectively.
The height of the spacers can be changed individually or in batches.
Also available to set “negative space (negative margin)” instead of the normal space.
And this block supports transform from and to core spacer block.
About negative space
“Negative space” narrows the margins both blocks above and below the spacer, and it is also possible to overlap the blocks.
If unintended overlap occurs, add a CSS class named “fsb-style-show-front” to the block you want to show in the front.
To apply the CSS class to the block, click on the block on WordPress editor, and check the block settings on the right for the Advanced setting ,then enter the CSS class.
Resources
Image for screenshot
License: CC0 Public Domain
Source: https://pxhere.com/ja/photo/245