We’re with you. JoomShaper is offering a 20% Discount on all plans due to the impact of COVID-19.

Support Offline : Mon - Fri / 10am - 6pm (GMT +6)

Your Time: Our Time:

Sticky header offset problem with anchor links. Content behind stick header

Featured Lock Resolved Issue
Hello,

i'm using Helix3 for my website. I have a problem when i make a one-page website with pagebuilder and i use sticky header. There is no offset for the anchor links. That's why a part of te content is behind de sticky header. Someone a solution for me?

Check http://www.kroamschuddeninhengevelde.nl to see the problem!

Thanks

2 Answers

pepperstreet

More than a month ago #Permalink
Hello, I would consider two things to improve it...

1.) give more white space to the sections. Add more padding on top and bottom. See -> Row -> Settings
2.) the header is quite large. Reduce the height in general... you could save 10-20 pixels.
3.) shrink the header dynamically, when it has fixed status. You have to add custom CSS for the height... investigate the markup and classes in your page source. You have to make sure to target the #header PLUS the surrounding container, which has a special class .is-sticky. So, your new rule for the height will override the initial height.

pepperstreet

More than a month ago #Permalink
pepperstreet wrote:
3.) shrink the header dynamically, when it has fixed status. You have to add custom CSS for the height... investigate the markup and classes in your page source. You have to make sure to target the #header PLUS the surrounding container, which has a special class .is-sticky. So, your new rule for the height will override the initial height.


Try this in your Helix3 template style -> Custom Code tab -> Custom CSS

.is-sticky #sp-header {
height: 85px;
}

This should shrink your header to 85 pixels after scrolling down...


There are no replies made for this post yet.
Be one of the first to reply to this post!

124

Templates

331454

Community Users

Newsletter

Don’t miss any updates of our new templates and extensions and all the astonishing offers we bring for you.
We never spam

Joomla! ® name is used under a limited license from Open Source Matters in the United States and other countries. JoomShaper.com is not affiliated with or endorsed by Open Source Matters or the Joomla! Project.

Connect Us