Anchor links cut off header?

Hi there,

We noticed that when we click on the anchor links (under “Individual Wellness” and under “Corporate Wellness”) , our header gets cut off almost in half.


This is, however, the way the header should look like at all times.

What can we do to get rid of the issue? Thank you in advance.

Hello Paper+Screen,

Thanks for writing in!

The header being cut off is only happening when you are logged in. That is because the Admin bar is blocking the Fixed header. It is not happening on my end. It could be just a caching issue since you have installed Breeze cache plugin. Please clear your plugin caches and test the site again.

By the way, please be advised that when using one page navigation, the ID like the positive_impact must be added in the section and not in the text element.

Please remove the ID from the text element and add it in the Section > Customize tab instead.

Best Regards.

The header being cut off happens even when we’re not logged in and we follow one of the anchor links. We haven’t experienced this issue until now.

Hey @INcroatia,

It looks like the issue is coming from the footer or something in the footer is shifting the whole site up if you visit a jump link directly from the address bar or clicking a jump link from an outside page like the Home page to Corporate Wellness.

I’ve set the page template of the Corporate Wellness page to Blank No Container | Header No Footer and the site doesn’t shift up.

Because I ran out of time, please duplicate your footer and assign it to the Corporate Wellness page and switch back to Blank No Container | Header Footer. Then, remove elements one by one in the footer and check if the issue will get fixed each time. Once the issue’s fixed, the last element that you removed is the culprit. You can then tell us what element it is and we’ll investigate the original footer that’s has the issue.

Thanks.

We’ve deleted element by element in the hopes of getting to the bottom of this, but the page behaved normally only once everything, including the sections, was deleted. We’re still trying to figure out what it is specifically, but so far have had no luck.

Hi @INcroatia,

It seems it’s okay now, I don’t see the issue similar to your screenshots anymore. It could be a broken content as well and it could affect the overall layout if not fixed.

I checked and tested your site here https://validator.w3.org/ and I don’t see the issue with broken elements anymore.

Thanks!

Unfortunately we don’t see it as fixed -please see screenshot below.

The header remains cut off for us whenever we follow an anchor link, unless we’re already on one of the pages that have them and then click on their corresponding anchor links to go lower on the page. We have tried deleting element by element and even entire sections (the header doesn’t get cut off only when the entire footer is deleted), we’ve looked into the header itself in case maybe something was wrong there… But we weren’t able to find anything that is wrong with it.

This is the first time we have come face to face with such an issue and we’d like to resolve it as soon as possible.

Hey @INcroatia,

To be clear, though the issue is with the header, the cause of it is something in the footer and I have found what that something is now.

It’s because of the bar you’ll see in the following screenshot.

image

The issue happens because the Bar’s height is to 4em and the Outer Spacing is 12em so it makes the content overflow and that makes the page shift up.

image

Setting the Bar’s Height to auto and setting Outer Spacing to 0 fixed the issue.

image

I’ll report this case to our development team so maybe they can improve the settings in the future.

Hope that helps.

1 Like

Thank you, @christian, you’re a life saver!!! Cheers!

You’re most welcome, @INcroatia.

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.