[Resolved] How To Add Padding To The Left Margin of Blog and Single Posts

[Michelle]

The content on my blog page and single post pages center fine on desktop and vertical mobile views, but on tablet or horizontal mobile views, the content sits to the left with no padding at all. I tried many settings in Customize, but have not found that any correct this issue.

Any light you can shed on a solution is appreciated. My login credentials are in the private information section below.

[Michelle]

I’ve been working on this. I found that adding this code made the horizontal mobile view look right, but added too much padding to the vertical mobile view:

.container {
padding-left: 40px;
padding-right: 0px;
}

There must be a better way. I had to remove the code.

[David]

Hi there,

is there a particular post or page where this problem occurs, I checked a few pages / posts and could not see the problem ? Maybe the devices browser cache needs clearing ?

[Michelle]

Hi David.

I cleared the cache with WP Rocket, Kinsta Cache, my browser’s cache, and my mobile phone’s cache. I also used Perfmatters to clear all leftover data. None helped so I doubt it is a cache issue. The problem is on tablet view and horizontal mobile view. https://www.reachingmyworld.com/Journal is the page. The same thing occurs on the single post pages…

[Michelle]

The issue shows on the actual devices but not on the desktop Preview

[Michelle]

I just discovered that the issue is occurring on Android phones, so I imagine this is due to the larger screen area, if it helps to know this. A family member’s iphone with a smaller screen looks fine.

[Michelle]

…And the problem exists on ipad tablets in the vertical orientation. The entire left side of my content is flush left. I could describe it as a full bleed, were it a print job.

[Michelle]

Update: I deactivated Perfmatters plugin and had Kinsta completely flush the cache from their end and things look much better. I still would like more padding on the left side, however. Any advice is appreciated.

[Leo]

Are you referring to the green space on the left here?
https://www.screencast.com/t/CBDHWdLG

If so you can increase the padding in the customizer with the mobile toggle activated:
https://docs.generatepress.com/article/content-padding/

Let me know if this helps 🙂

[Michelle]

I did try that, but will try it again. Thank you.

[Leo]

No problem 🙂

[Author]

Posts