Archived topic
Gap
5 replies · Started by Jatin on February 9, 2021
How to reduce the gap as shown in the screenshot:
Hi Jatin,
You can go to Customizer > Container > Content Padding, to reduce the top padding.
Additionally there's a margin applied to the content, this CSS can remove the margin completely.
.single .inside-article .entry-content {
margin-top: 0;
}
Let me know :)
Hi Ying that did worked on the desktop but the issue is mainly on the mobile phone. When you open any post in mobile phone the Gap seems / looks more. But I wont worry about desktop for now. Example link in the info box.
There are multiple things that contribute to this "gap".
One is the .entry-content's margin-top which can be addressed by adding this:
.entry-content {
margin-top: 0px !important;
}
Another one is the weird empty header.entry-header before your .entry-content which can be addressed by this CSS:
header.entry-header {
display: none;
}
But its good housekeeping to find out why this exists.
Lastly is .separate-containers .inside-article padding which can be addressed by adding this css:
@media(max-width:768px){
.separate-containers .inside-article{ padding-top: 0px !important; }
}
Thanks
No problem. :)