Blog Header overlaying blog page and post content

8persap · July 2016

Hello There.

Please can you help. On our blog page and on the post pages, the header/nav is overlapping the content. Please see screenshots - https://snag.gy/84nWOC.jpg and https://snag.gy/SGpIBb.jpg

Please can you let me know how I can fix this issue? Thanks.

Regards

Mark.

Albert · July 2016

Hi Mark,

you probably set header to be transparent and that's why this is how it works This is the whole sense of being transparent.

8persap · July 2016

Thanks for the quick reply.

It's using the semi transparent header. This is fine on regular pages. But doesn't work on the Blog page and single posts as the header/nav goes over the content.

How do you suggest this be addressed?

Thanks

Mark.

8persap · July 2016

Here a like to the site - http://hotwallsstudios.co.uk/staging

I guess there just needs to be some extra padding/margin on the blog page and single post pages? Is there a way to do this? How have others dealt with this?

Thanks.

Mark.

Albert · July 2016

On most pages it's fine because you use header's background. However, you didn't set any for blog page and that's why the instead of background, content goes behind what is standard behave. You can use the following css to move the content down on blog pages, but we can guarantee that this would work properly on all types of pages:

.blog #Content { margin-top: 140px !important; }

8persap · July 2016

Thanks for that. That worked on the blog page, but not on the single posts.

I tried '.single.single-post #Content { margin-top: 120px !important; }' and that worked on single posts.

You mentioned I didn't set a background image for the blog page or posts. I didn't realise I could do that. How do I do that?

Also, is there a way to make the width of the single blog post content narrower? Please let me know.

Thanks

Mark.

Albert · July 2016

1. Header background can be set with Featured Item option which is on the right side while editing/creating pages.

2. We are sorry but it is not possible to set post content narrower on single post pages only.

Blog Header overlaying blog page and post content

Comments