Flexible Spacer Block switches the height of the spacer according to the device’s screen width (breakpoints). This block has two adjustable breakpoints, so you can set a separate spacer height for smartphones, tablets, and desktops. These heights can be changed individually or all at once.

You can also set “negative space (negative margin)” instead of normal space. In addition, the block can be transformed from and to the core Spacer block.

About negative space

“Negative space” reduces the space between the blocks above and below the spacer, and can even make them overlap.

If unintended overlap occurs, add a CSS class named “fsb-style-show-front” to the block you want to display in front. To apply the CSS class, select the block in the WordPress editor, open the “Advanced” panel in the block settings sidebar, and enter the class in the “Additional CSS class(es)” field.

Resources

Image used in screenshots

License: CC0 Public Domain
Source: https://pxhere.com/ja/photo/245