Is it possible to reduce padding/white space in column blocks?

Update.

It seems like this code party reduces the bottom padding of the column (but there is still to mych padding);
.wp-block-columns {
margin-bottom: 0 !important;
}

I found this code below. It does something with the cover blocks, like a zoom-out. I doesn’t get this part “.wp-block-column p”. Any ideas?
.wp-block-column p {
margin-bottom: 0.5em !important;
}

Still struggling reduze the gap between the columns. Any suggestions?

Hi @boppar,

Thanks for reaching out us about reducing the spacing on the homepage. I’ve had a look at the site and noticed that there’s two places where the margins need to be reduced that’s a little different than the code you found, as I found a different code that involves reducing the margins for two separate blocks.

Can you please try adding this code to your site:

/* Fix homepage block spacing issue  */
#post-536 > div > div.wp-container-10.wp-block-group.alignfull.align-fullwidth-custom.has-background > div > div.wp-block-columns.has-white-background-color.has-background .wp-block-column, #post-536 > div > div.wp-container-10.wp-block-group.alignfull.align-fullwidth-custom.has-background > div > div.wp-block-columns.has-white-background-color.has-background .wp-block-columns {
    	margin-bottom: 0!important;
}

I’ve made an exception here and customized the code a bit for your site, so it’s little longer than the usual code. The reason for that is because the margins get reduced on all the blocks otherwise and because those already have the correct spacing, they end up with no spacing at all. So I’ve set the code to only apply to the section you shared in the screenshot.

Here’s what the spacing looks like before the code above was added to the site:

Link to image: https://d.pr/i/qWQIU6

And here’s what the spacing above looks like after the code was added:

Link to image: https://d.pr/i/K8sxpZ

Does that work for you?

Hi @wpniall

Unfortunately it didn’t work.

Hi there,

Thanks for getting back to us.

Can you please try to use the following CSS code instead?

.home .wp-container-22.wp-block-columns {
    margin-bottom: 0 !important;
}

.home .wp-container-24 {
    padding-bottom: 0;
}

.home .wp-container-23.wp-block-column.is-vertically-aligned-top {
    margin-bottom: 0 !important;
}

Let me know how it goes!

Best,

Hi @daniyalahmedk

It didn’t work. Nothing changed.

Hi there @boppar

Could you try the CSS code below:

.home .hentry .entry-content .wp-block-columns .wp-container-24.wp-block-column,.home .hentry .entry-content .wp-block-columns .wp-container-23{
  margin-bottom:0 !important;
}

Be sure to clear cache and minified CSS before testing it again. ??

Hi @kaushiksomaiya

Thanks a lot. It worked as a charm.