[Support request] problem left and right padding of GB containers

[Friedhelm]

Dear GP team,
I have a problem with the left and right padding of my GB containers. The padding on the GB containers is set as follows: 0 25 0 25. This is also done correctly on the single side. In the blog (GP-circle) only the current post looks like this, the other posts with GB containers do not take this into account. By the way: The same problem arises with the query loops.

Blog: Second post: Padding is not considered.
Single-side of the second post: Padding is taken into account.

I’ve been testing around for three days, but I haven’t found the cause. Do you have a solution for this?

[Ying]

Hi there,

I read this topic and checked the links, but I am not sure I understand your question.

Can you take a screenshot, upload here and share the link with us?

I think screenshots may help us understand your issue.

[Friedhelm]

Hello Ying
here are the two examples: one with a border and one without padding

[Fernando]

Hi Friedhelm,

Can you share temporary login credentials? We’ll try to check your setup and see what’s going on.

Please use the Private Information field for this: https://docs.generatepress.com/article/using-the-premium-support-forum/#private-information

[Friedhelm]

Fernando, Thanks for the quick reply: see below.

[Fernando]

Hi Friedhelm,

The padding is added through GenerateBlocks directly on the page. By default, this padding doesn’t carry over to the Blog to prevent bulking of the blog page. Think of having a lot of posts and adding all unique code for each post in the Blog – this would bulk up the Blog so much.

What you can do is use a Block Element – Content Template for the Blog and Archive Pages to style them the way you want to: https://docs.generatepress.com/article/block-element-content-template/

I would also advice to add the First image through the Featured Image Meta field instead.

[Friedhelm]

Hello Fernando,

my blog is normally 770px wide (with 759px images). Only occasionally I want to show 1200px photos) using the GB container. This works on the singles side, but not on the block side.

Your suggestion seems too complicated/too time-consuming, so I will only use the pictures in the “normal” format (750 px) in the future.

Thank you very much for your efforts. This post can be closed.

[Fernando]

Well, another solution would be to add it manually through custom CSS. Just let us know if you want to go through with this.

You’re welcome Friedhelm!

[Friedhelm]

Hello Fernando.

I’m very happy that you have another solution up your sleeve. I would like to use a custom CSS to solve the problem.

Thank you for reaching out again.

[Fernando]

Can you try adding this in Appearance > Customize > Additional CSS:

.blog .entry-content > .gb-container > .gb-inside-container {
    padding-left: 20px;
    padding-right:20px;
}

You can also include a class to that Container Block through the advanced section of its Block Settings so that the code would be more precise.

[Friedhelm]

Wow! That’s great. The input in Additional CSS works perfectly.

But you’re right, because I have better control with the variant with a class directly in the container block.
What would the CSS be for a class? (I tried this with several variants, but they didn’t work).

I am looking forward to your answer.

[Fernando]

It should be:

.blog .entry-content > .gb-container.your-class-name > .gb-inside-container {
    padding-left: 20px;
    padding-right:20px;
}

Replace your-class-name with the class you set for the Container Block.

[Friedhelm]

Great, Fernando, the class is going well. I’ve closed the topic for now. GeneratePress has the best support I know. Many Thanks.

[Fernando]

You’re welcome Friedhelm!

[Author]

Posts