Site logo

Archived topic

How to remove gap created by shortcode blocks

5 replies · Started by Clemon on September 2, 2021

Viewing posts 1–6 of 6

hey guys,

I am not able to figure out how to remove the gap between blocks that get created whenever I use the shortcode block. is there a snippet i can add to resolve this? I was successfully able to remove normal gaps between blocks using this code:

.entry-content > [class*="wp-block-"]:not(:last-child) {
    margin-bottom: 0;
}

Hi there,

for those kinds of layouts my personal approach would be to use the GB Container Block to divide the page into sections.
The Container Block has its own margin settings, and by default that is 0. Which will eliminate any spacing between them. And anything inside the containers will NOT be affected by the margin-bottom CSS that the theme adds for regular blocks.

I'm familiar with container blocks and they normally work great. But in this instance, they don't eliminate the gaps the shortcode blocks create.

This site has a membership plugin (yith) and I use their shortcode to hide content and display alternative content to certain users. before adding the shortcode, everything looked great and there were no gaps. now that I've included the code around the grid blocks I want to hide, these gaps show up. I've tried both shortcode blocks as well as paragraph blocks with no result in eliminating the gaps.

is there a particular way to use the container blocks to better run the code by creating the gaps or an alternative code I can add to additional CSS to hide paragraphs that don't have visible text?

Hi Clemon,

Give this CSS a try:

p:empty {
    margin-bottom: 0;
}

that did the trick ying! thank you!!

You are welcome :)

This archived topic is closed to new replies.