Docs

[powrider686]

Hey there,
On my page, http://henryebarr.wpengine.com/copper-mountain/, I’m trying to have the first section have a background image, then put the page header, Copper Mountain, over the image. I can’t get the layout to work though, as it seems the header and main content areas are overlapping.

I’d like to have it look like this – http://thebarrteam.wpengine.com/summit-county-information/copper-mountain-colorado/, and I thought that should be easy enough, but for some reason the layout isn’y working. Could you take a look?

Thanks for the help!

Marcus

[powrider686]

This reply has been marked as private.

[powrider686]

A quick update: All of the pages under Summit County, CO, on the menu, exhibit this problem. All of the pages cut off the top of the content area, resulting in the first section and photo not being shown on any.

I’d like to have each page start displaying at the beginning of the content area.

Thanks for the help!

[Rad]

Hi there,

Thanks for writing in.

Please add this CSS to Admin > Appearance > Customizer > Custom > CSS

.masthead {
min-height: 211px;
}

Hope this helps.

[powrider686]

Hey,
Thanks for that but it didn’t really fix it.

Check out the attached screenshots – the first section with the image is visible in cornerstone, when you are building the page, but on the viewable site, it hides the first section and image behind the header.

That’s not normal for it to be overlaid with the header like that is it? I feel like it should just line up with the bottom of the header.

Could it be a problem with the install of x or cornerstone?

Thanks for the help. Trying to get this site up this week.

[Paul R]

Hi,

Iwas able to fix it by addding this in the style field of your section.

min-height:200px;background-size:cover;

Kindly check on your end.

Thanks

[powrider686]

Ok, so that didn’t really work either. Please see the attached screenshot.

I don’t understand why the first section doesn’t act be like any other section, and meet with the bottom of the header?

I have an image, 2560×400, that I would like to be the background of the first section. I would also like to overlay a Custom Headline over it. That is possible with every one section or row within Cornerstone, and it even looks like it will work in Cornerstone but then the front end shows a different result.

Could there be a bug or problem that is causing this issue? I don’t feel this is how Cornerstone and X are supposed to be, based on previous sites built using X.

Thanks again for help in figuring this out.

[Friech]

Hi There,

This is a two fold issue, first is the navbar is short on height a little bit than it should. That is why the first section overlaid with the navbar.

The custom CSS provided above by RAD should resolve this issue. But you can also adjust that on Customizer > Header > Navbar Top Height, I did go ahead did that.

Secondly is with the section, you wrote: I would also like to overlay a Custom Headline over it. That is possible with every one section or row within Cornerstone.

You place the Custom Headline element on the second Section, that is why it is not showing above the background image of the first section.

And then since that first section has no actual content, it does not generate a height on the front-end. That is why we are only seeing a small portion of it.

I did go ahead and place the Custom Headline element on the first section, and I also added a Gap element above and below that headline so your section will get an actual height for the background-image to be visible.

Hope this helps.

Cheers!

[Author]

Posts