- This topic has 14 replies, 3 voices, and was last updated 5 years, 1 month ago by
David.
-
AuthorPosts
-
February 11, 2021 at 1:12 am #1653995
Charbel
Hello @David,
I have recently noticed that I can see blank space above the featured post on the homepage only.
Could you please advise what could be the root cause?
Thank You!
February 11, 2021 at 2:24 am #1654090dorian
Hello,
You should either disable Page Hero for the front page or simply minimize the percentage of the ‘white space’ as right now it stands at 16% of it’s height.
Navigate to Appearance / Elements & find you home-page hero element.
This is the CSS currently that is displaying the white space:
.page-hero {
padding-top: 16%;
}February 11, 2021 at 3:49 am #1654163Charbel
Thank you @Dorian,
Yes, the padding-top: 16% was added based on the feedback from @David here to fix the image background inside the container for (single) posts only and not the homepage:
If I reduced the
padding-top:to 0% for example, the home page will be fixed, however, the feature image for a single article in the container will get broken.Any idea how to fix both (homepage + single post)?
Thank You!
February 11, 2021 at 3:52 am #1654167Charbel
Please check here: https://charbelnemnom.com/
And then check here: https://charbelnemnom.com/backup-best-practices-in-action-the-backup-bible-complete-edition/
February 11, 2021 at 5:49 am #1654289David
StaffCustomer SupportHi there,
you have this CSS that is adding top margin to the Hero element:
.page-hero { margin-top: 30px; }If you want to keep that space on the single post but remove it on the homepage then change it to:
body:not(.home) .page-hero { margin-top: 30px; }February 11, 2021 at 6:14 am #1654309Charbel
Thank you @David for your kind support,
Please note that I have changed it to
body:not(.home) .page-hero { margin-top: 30px; }keep the space on the single post but remove it on the homepage and then I cleared my cache. I still can see the big space on the homepage, it was reduced a bit only.
Could you please check? I tried with Google Chrome and Edge browser.
Thank You!
February 11, 2021 at 6:31 am #1654321David
StaffCustomer SupportI am not seeing any space before the featured post ( header element ) – i am occasionally seeing large space below that – before the post grid… which is coming from an Advert
February 11, 2021 at 7:10 am #1654566Charbel
Thank you @David,
The big space before the featured post on the home page is showing only a big screen like 27″ only.
I tried on 24″ and 15″, the featured post is attached directly to the Black Menu.I think because of this one that you told me to use for the background image inside the container for a single post:
@media(min-width: 1600px) { .page-hero { padding-top: 16%; } }Could you please advise?
From the Advert, you are right is below the featured post.
February 11, 2021 at 7:50 am #1654637David
StaffCustomer SupportOk so you dont need the padding on the home page as thats whats causing the issue – so just use this CSS:
@media(min-width: 1600px) { body:not(.home) .page-hero { padding-top: 16%; } }February 11, 2021 at 7:58 am #1654653Charbel
Thank you @David, much appreciated!
I revert back to the page-hero CSS with 30px.
.page-hero { margin-top: 30px; }And updated the media without the padding on the home page.
@media(min-width: 1600px) { body:not(.home) .page-hero { padding-top: 16%; } }It’s working great.
Many Thanks David!!!
-Charbel
February 11, 2021 at 9:50 am #1654791David
StaffCustomer SupportGlad to be of help.
March 1, 2021 at 12:30 am #1676823Charbel
Hello @David,
Hope you are doing well.
Sorry, I want to come back to this issue please.
I have noticed that the author page is not well sized on big screens (27″).
https://charbelnemnom.com/author/charbel-nemnom/
I have noticed a large black space above the author-page (profile) under the Main Menu.
This is related to the image padding size that we updated using the CSS code above.
How can we exclude the author page from this please?Thank You!
March 1, 2021 at 2:27 am #1676951David
StaffCustomer SupportYou would change the CSS selector ie. this:
body:not(.home) .page-heroto:
body:not(.home):not(.author) .page-heroMarch 1, 2021 at 3:49 am #1677024Charbel
Thank You @David for your quick response as usual, much appreciated!
The issue is resolved for the author page.
March 1, 2021 at 5:14 am #1677099David
StaffCustomer SupportYou’re welcome
-
AuthorPosts
- You must be logged in to reply to this topic.