[Resolved] I need some space between tags & categories and post navigation on Posts

[Michael Mancini]

I have looked through the customizer and cannot find this setting. If there isn’t a setting can you give me the CSS?

See Image

[Leo]

Try this:

.post-navigation {
    margin-top: 10px !important;
}

[Michael Mancini]

Hi Leo,

No change.

MM

[Leo]

Hmm can you link me to the page?

[Michael Mancini]

Link

[Leo]

Updated code above.

[Michael Mancini]

Leo,

That worked. While we are on this area, there is no margin or padding on the categories, tags and post navigation. They go to the edge of the page in mobile. Anything else added in that area has the same problem like the share buttons I am using that add themselves below the posts. Is there a setting I am not seeing in the customizer? If not you should let Tom know about this and in the meanwhile could you give me the CSS so that they align with the rest of the page?

Thanks,
Michael

[Leo]

Hmm can you try adding some mobile content padding? https://docs.generatepress.com/article/content-padding/

Let me know.

[Michael Mancini]

Yes I have added mobile content padding and there is no change. It is now set to 30px. It seems like it is set to go to the edge no matter what you set.

MM

[Leo]

That’s because you are using contained here: https://docs.generatepress.com/article/page-builder-container/#contained which removes all the padding. The content padding above is from beaver builder.

If you want padding on the whole container, maybe try removing the padding from BB and uncheck page builder container meta box? Then GP’s content padding should work.

[Michael Mancini]

Leo,

I tried all the different container settings. Contained and full width moves the cat/tag/nav to the far left edge. Default is the only mode that kept some padding on your elements. You said “uncheck” a mode but you have to select one. Why do these elements go to the edge of the page? I made a screenshot of all three modes in mobile to show you what I am seeing.

There has to be some padding on the after content container.

MM

[Tom]

The Contained and Full Width options in the Page Builder Container meta box remove all of the padding from GP elements in the content. This is because those options assume the Page Builder takes over the content, adding padding inside each PB section.

Unfortunately there’s no real way around that, but you can do something like this:

@media (max-width: 768px) {
    .entry-meta {
        padding: 0 20px;
    }
}

[Michael Mancini]

Hi Tom,

That works, but on iPad landscape it still goes to the edge.

This means that if I choose a full-width container for posts the cat/tag/nav will go to the extreme left, which looks awful.

Plugins that automatically add to the after content area like the social follow buttons I am using will also need CSS to add margins. Am I missing something?

Michael

[Tom]

You’ll need to adjust the media query for it to work with larger screens like landscape.

It’s kind of a tough problem – page builders need full control over the page – no padding. Then it can take over and add padding etc.. If the page has padding, the page builder content doesn’t look right.

Pages that have a mix of a page builder and theme content will run into these kinds of issues unfortunately. I’m up for suggestions if you have any 🙂

[Michael Mancini]

Hi Tom,
I agree it’s a tough problem. Why can’t items that are below the main content area have different settings in the customizer to set padding, font size, etc. Is that possible?

Michael

[Author]

Posts