Sticky Header Pages


#1

Dear Support,

You replied to this topic last year for someone: https://athemes.com/forums/topic/sticky-header/

Which is relevant to me and this works on the home page: http://print.rawdemo.co.uk but if you try visiting one of the internal pages you will see that the menu scrolls but the header-contact is in the wrong position.

Can you advise what I need to change to make the internal pages have the same header as the front page please.

Many thanks,

Rob


#2

Dear Rob,

Could you please try to apply the following CSS code?

.site-header{
  position: absolute !important;
}

.site-header.fixed{
  position: fixed !important;
}

.site-header.float-header{
  padding: 5px 0 !important;
}

Let me know how it goes. I’ll wait to hear back from you regarding your stats.

Regards,
Kharis


#3

Hi Kharis,

Thank you very much for getting back to me.

Interestingly, this works fine in Firefox but in Chrome the menu appears a little bit too high which is obscuring the contact information?

I normally find a great deal of consistency between Chrome and Firefox. I’ve tried to work this out for myself but I just can’t crack it.

Sorry to trouble you again but if you try in Chrome, what do you see?

http://print.rawdemo.co.uk/what-we-print/

Many thanks,

Rob


#4

Hi,

Sorry to chase you on this but just wondered if you’d been able to identify why it works in Firefox but not in Chrome?

Many thanks,

Rob


#5

Dear Rob,

It seems to work fine in my Chrome. Could you confirm if you are using the latest version of Chrome?

Regards,
Kharis


#6

Hi Kharis,

You’re right - its working now and I am on the latest version of Chrome. Perhaps it updated? Post can be marked as completed.

Thanks for your help.

Rob


#7

Hi Kharis,

I was mistaken, it still isn’t working:

If you click this link: http://print.rawdemo.co.uk/how-we-print/
You will see that the menu is overlapping the header-contact.

If you click this link: http://print.rawdemo.co.uk/
You will see on the home page it is fine.

I am on the latest version of Chrome: Version 48.0.2564.103 m

I hope you can shed some light on this?

Many thanks,

Rob


#8

Dear Rob,

Thank you for updating me.

Could you please try to apply the following CSS code?

.site-header{
 margin-top: 53px !important;
}

Let me know how it goes. I’ll wait to hear back from you regarding your stats.

Regards,
Kharis