Header not sticking on top on-scroll

Hi, do you happen to have a link to the page you are working on? That would help a lot.
You can try this code and see if it does what you need. Set the section top margin to 50px and then add this custom css

.she-header {
    top: 0 !important;
}

Let me know if that helps.

I have tried to incorporate the above mentioned custom css, but I am afraid the code is not working. I will share the link I am working on shortly.

I forgot a piece of the code. Try this

.she-header {
    margin-top: 0 !important;
    top: 0 !important;
}

Hi Robert,

Thanks for taking your time.

I am afraid you did not understand me, or I probably didn’t describe the issue properly.

Here is an example of what I’m after:
https://www.blackstone.com/

Unlike this example, my header has a background in it. So, initially it has a margin a 50 pixels, which then needs to disappear while forcing the header stick on top when one scrolls down.

Ok, I think I understand. Try these settings…
Select your main header section and under the layout settings set it to a specific height in px (ex: 150px).
Go to the advanced tab and set the bottom margin to the same but negative (ex:-150px), and top margin to 0.
Set the z-index to 99(a high number so it stays in front).
This will move the next section up behind your header.
Below the advanced settings, you should see motion effects settings. Here, set sticky to “top”, offset and effects offset both to 0.
This makes your header sticky to the top of the page and below any section above it without any gaps.
Finally, go to my plugin settings and make sure transparent header setting is off.

You might need to adjust the scroll distance for best results. Here is an example site with these settings https://www.thedavenportlounge.com/san-marcos/

If this isn’t what you need I’m going to need you to email me some screenshots or something so we are on the same page. [email protected]

Let me know if this helps

If you just need to remove the margin from an element or section once the scroll point is reached you can use the built-in elementor “selector” and my plugin class .she-header to remove it. You have to put the css in the custom css section for that specific element or section.

.she-header selector {
    margin: 0 !important;
}

If you do not mind, please let me know whether sending an email would not cause any inconvenience.

Yes, please, feel free to email me [email protected]

Thank you for the commitment, that is highly appreciated.

As I have already written an email to you, I am looking forward to hearing from you.

I just wanted to say that Robert literally did everything to help me get this solved!

There is still hope in humanity, thanks man!

Happy to help