Blog Header Under Nav Bar

Support
#1

Hi,

I have set up a blog page on my site, however the header of the blog is hard to read since it is showing up under the nav bar. See image below.

Do you have any recommendations on how to fix this? Also, how do I make the posts so they show in thumbnails? Say 3 per row.

Thanks,
Colton

#2

Hi Colton,

Please add this code in the custom CSS:

.blog .masthead {
    position: relative;
}

If this code doesn’t sort it out, kindly provide the URL of your site.

Hope this helps.

#4

Hi,

The code didn’t seem to work. Below in the secure note is the URL of our site.

Thanks,
Colton

#5

Hello Colton,

Thanks for sharing website URL. Please remove previous code and add following CSS to fix overlapping of navigation and blog title:

h1.h-landmark {
    margin-top: 50px;
}

Thanks.

#6

Thank you, that worked great!

#7

Hello @adminsvea,

Glad to know that worked out for you! I also just wanted to let you know that after looking at this a little more deeply, I think the true cause of the issue might be with a setting in your theme options. I’ve noticed that you’re using a combination of our legacy headers and new headers on the site. Make sure to go to the theme options and ensure that your navabr height for your legacy headers is setup appropriately. It looks like from the generated CSS that your output height is currently 25px, which sets the height for the navbar container. Because of this, it appears as though your header is bumping up beneath the navbar, but if a proper height is set on the navbar it should appear appropriately and you wouldn’t need that CSS implementation.

Hopefully this helps to point you in the right direction, cheers!