Layout differences between posts and pages

I have noticed that the Wordpress Related Posts plugin on our website behaves differently on pages and posts (see attachments)

On pages the plugin behaves correctly and three columns of thumbnails are displayed. However on posts only two columns of thumbnails are displayed.

I have the feeling that this is something to do with the post inner content and secondary content boxes, which are displayed on posts but not on pages.

How can these boxes be managed or removed, so that the 3 columns of thumbnails will show on posts?

Hi there

Hope you are having a good day and thank you for your question :slight_smile:
I need a link to the page and linkt to the post
Thanks!
Colorlib Support Team

Hi Noda

Firstly I think I posted this on Dazzling by mistake - the theme I am using is Sparkling. Can you please move this to the correct Forum - Sparkling?

The problem I am having is on both desktops and tablets when the page width is 1024 pixels wide.

A typical example of a page, which shows 3 columns of thumbnails as it should be is as follows: https://focusingonwildlife.com/test-platform6/log-in/

A typical example of a post, which shows the problem with only 2 columns of thumbnails is as follows: https://focusingonwildlife.com/test-platform6/beema-yellow-wagtail-deffi-park/

Hoping you can come up with a solution to this issue.

hey there

Please add this CSS in appearance - customize - additional CSS

.post-inner-content {
padding: 45px 20px;
}
Love your pictures, they are amazing!

Thanks!
Colorlib Support Team

Hi Noda

By moving the image block over to the left by 30px it does enable 3 columns of images to be displayed. However it also reduces the margin of all other content on the page from 50px to 20px, which is aesthetically undesireable. With pages the left margin stays constant at 50px for all content.

Could our objective be better achieved by changing the code in the content-single.php file to be similar to the content-page.php file?

Howdy :slight_smile:

mm, Maybe we can different approach and resize only bottom part of the content, please try this css instead:

.post-inner-content .post-inner-content.secondary-content-box {
padding: 20px 0px;
border: 0px;
}

It will also remove vertical borders for “you might also like” section

Hi Noda

This worked perfectly and the layout now looks great.

Thanks for your excellent support.

You are welcome @supertrooper :slight_smile:
If you ever decide to visit Georgia just let me know
I will close this case now