SOLVED: How to avoid jumpy sticky header on scroll in Firefox

Browser: Firefox
OS: Windows
URL: Link to a page that illustrates this issue

Please help: The header should decrease in height while in sticky position. Firefox has problems with the transition from standard to sticky, it flexes and annoys me. It doesn´t work with padding nor height nor display none.
Thanks for your attention.
Jonas

[Please describe this bug in as much detail as possible so we can replicate & debug this bug]

Hi @Jonas_Voelkmann,

Can you please share a recording of the issue with Firefox? I tried visiting the site & scrolling down and the sticky header’s behaviour was consistent on my end on both Chrome & Firefox.

Thanks for checking. The video showing the problem is here:

@Jonas_Voelkmann Welcome to the forum :slight_smile:

I just had a quick look at your site.

Can you try adding a transition delay to your header div (element ID: mltacp)?

You might need to fine-tune the exact value, but something like transition: all ease .3s .3s; should already help.

Thank you very much, it works fine.
Do you know, why firefox needs this delay?

Jonas