Formatting Off on Page

[brockburwell]

As you can see on the page below, the top of the page is pushed up into the menu. How do I change this?

http://theopendoor.church/category/events/

[jumar]

Hello @brockburwell,

Thanks for writing in!

It’s currently showing the under construction page.

We’ll just wait for your site to be ready.

Thank you.

[brockburwell]

OK, try it now

[thai]

Hi There,

Please find this custom CSS:

.masthead {
    margin-bottom: -100px;
}

And change to this:

.home .masthead {
    margin-bottom: -100px;
}

Hope it helps

[brockburwell]

While that helped change the event page, I built every other page around that CSS you had me change, so it made a gap at the top of all the other pages (I changed it back for now). Any suggestions on how to do that for just the Event page?

[Prasant]

Hello @brockburwell,

Thanks for updating thread.

You can use .category-events .masthead CSS selector to limit the changes onto events page.

Thanks.

[brockburwell]

Hmmm…I’m not sure what the CSS selector is. Do you mean, instead of putting the following…

.home .masthead {
margin-bottom: -100px;
}

I put…

.category-events .masthead {
margin-bottom: -100px;
}

Cause that didn’t do anything

[jumar]

Hello there,

Please update your CSS code to:

.masthead {
    margin-bottom: -100px;
} 
.category-events .masthead {
    margin-bottom: 0 !important;
} 

Hope this helps.

[brockburwell]

That worked perfectly! What I’m finding now is that the Event page looks great, but when I click on each post, the formatting goes back to how it was before. Any suggestions on how to fix that? You can see an example below.

http://theopendoor.church/45/

[friech]

Hi There,

I can’t see any of your event pages, I think that is because of we’re not login? Try updating the previous given code to this:

.masthead {
    margin-bottom: -100px;
} 

.single .masthead,
.category-events .masthead {
    margin-bottom: 0 !important;
}

Hope that helps,
Cheers!