I'm using a theme called "Blockst" from DeoThemes. On each Post title, I have an incredibly large title background. Unfortunately, I have no idea why or how it became so large. Unfortunately, I'm not a WordPress/CSS expert, but I don't think I caused this. Interestingly, it looks terrible on PC, but on mobile it looks like perfect spacing..
Example page: https://eric.frydendal.org/installing-uptime-kuma-behind-nginx-with-a-self-signed-cert/
Notice the teal title background is HUGE. I've tried:
- Adjusting the header size in Themes > Customize. This adjusts the floating menu only
- In Customize > Blog > Single Post, I disabled all options: "Show featured image", "Show category", "Show date", etc. Nothing affected the background size.
- I believe it has something to do with the Featured Image, but I don't fully understand how those are used.
- Verified none of my custom CSS has anything to do with sizes (just colors).
Looking at the source, I think something related to this line is causing my issue, but I don't know why it's leaving space for a non-existent image:
<!-- Featured Image -->
<div class="single-post__featured-img single-post__featured-img--layout-1 bg-overlay bg-overlay--dark" >
Here's my complete Custom CSS:
/* Change header background color after scrolling */
.nav--sticky.sticky {
background-color: #1e1e1e;
}
/* Change only header on top of page dark mode */
.blockst-header.nav {background-color: #1e1e1e;}
/* Change header link color & make the line under header light blue */
:root {
--deo-nav-links-color: #e9e9e9;
--deo-border-color: #31ECDE;
}
/* Change back-to-top arrow color */
#back-to-top a {
color: #1d2327;
}
/* Homepage only background dark */
.page-id-942 {background-color: #1e1e1e !important;}