Blog post titles suddenly missing

Hey everyone. Something has happened with my blog posts where now I'm unable to add, edit, or even SEE titles. I had 6 that we're working fine. I went to add a 7th and now all the titles are hidden up behind the header and I can't even edit the titles on new posts. Did I do something wrong? And why can't we use the new free flowing or whatever its called layout for blogs yet?

Example page: https://www.aspiremusicgroup.com/news/rayvpopout

This is how my blogs look, and until the most recent, you see they all had titles just fine:

Now all of their titles seem to have risen so high on the page they're actually hiding behind the menu/header. If I zoom out to 25% I can start seeing the titles. What happened here? I have no code pointing to anything with my blogs except to hide hashtags. Notice the top of the picture is slammed to the header. Its behaving like I put a code to shrink the margin or padding up top for no reason. Any ideas?

Followup, I've found this code from @tuanphan that seems to help for the time being... but why outta nowhere do I need to use CSS just to be able to see my titles?

body[class*="type-blog"].view-item header#header {
    position: relative !important;
}
body[class*="type-blog"].view-item article section:first-child {
    padding-top: 40px !Important;
}

1 hour ago, AspireMusicGroup said:

Followup, I've found this code from @tuanphan that seems to help for the time being... but why outta nowhere do I need to use CSS just to be able to see my titles?

body[class*="type-blog"].view-item header#header {
    position: relative !important;
}
body[class*="type-blog"].view-item article section:first-child {
    padding-top: 40px !Important;
}

 

Remove this code

And remove this below code from your CSS box, then check again

@media screen and (min-width: 767px) {
    section[data-section-id="662729e30a17ac2634651b7c"] {
        padding:350px;
        padding-bottom: 50px !important;
        padding-top: 50px !important
    }
}

34 minutes ago, tuanphan said:

Remove this code

And remove this below code from your CSS box, then check again

@media screen and (min-width: 767px) {
    section[data-section-id="662729e30a17ac2634651b7c"] {
        padding:350px;
        padding-bottom: 50px !important;
        padding-top: 50px !important
    }
}

 

wowwww. So the code I had to organize the search bar position and blog page height.... controlled all of the blog posts? So that one section ID from the main blog page is used for every single blog post. Great catch.

The only issue is, when I remove that code, it now leaves a huge gap under the search bar I created there. Should I leave the original code in or will it cause issues? Or is there a better way to put that search bar where I want than having it in its own mini section like it is, and then using this code you said to remove on the section below it? Hope this wasn't confusing.

You can also change your code to this, to prevent it run on Edit Mode Only

@media screen and (min-width: 767px) {
  body:not(.sqs-edit-mode) section[data-section-id="662729e30a17ac2634651b7c"] {
        padding:350px;
        padding-bottom: 50px !important;
        padding-top: 50px !important
    }
}