Try adding these one by one to “Customizer – Additional CSS” to see which one helps …
.site-main > article > .entry-content {
margin-top: 0;
}
#review-statistics .review-wrap-up {
margin-top: 0;
}
.single .entry-header {
display: none;
}
Oliver
The third one worked.
However, when I tried the first one it somehow created extra space above the header on mobile screens. Then when I deleted it and saved the changes, the extra space above the header remained. Even after flushing the cache on my website and delete cookies, cache etc. on my mobile device, the new extra space above the header still remains.
I tried to remove it with the options plugin, but the plugin only removes the space on larger screens which is the opposite of what I need. On larger screens the space above the header is fine, it’s only on a mobile device where there is extra space added above the header.
It’s frustrating how the spacing on mobile screens is different than the spacing on other screen sizes, with no way to change it specifically on mobile screens. If the spacing is going to be different on different screen sizes, the ability to change the spacing independently should exist.
The extra space that has now been created above the header on mobile devices also exists on the homepage and every other page as well. Unlike the original problem of extra spacing below the header on mobile screens, which only existed on posts.
When I turn the mobile device sideways, the new extra space above the header is gone and everything looks fine. It’s only there when the mobile screen is in the vertical position. Which is also weird because the original problem of too much space under the header existed in both screen positions on a mobile device.
Hello,
The padding you mention is required on sites that have a primary menu for the header to have depth. This was fixed on the last update which is why you have just noticed it.
We will add an option to remove this padding on mobile devices for sites that don’t have a primary menu (like yours) but in the meantime, this will remove it for you …
.site-header {
padding-top: 0;
}
Please be aware that the theme’s mobile breakpoint is very small (481px) so it’s likely that when you turn your device sideways, the theme thinks it is being viewed on a larger device.
Hope that helps explain things.
Oliver
