Sticky Header (navigation bar/menu bar) not centralized in Safari

Don’t use margins, use position https://developer.mozilla.org/en-US/docs/Web/CSS/position

Thanks for the prompt reply, Andrew!

So does that mean I simply change all the ‘margin’ to ‘position’?

Like below? (Just capitalised to show the changes)

#small-nav {
border-color: transparent !important;
background-color: transparent !important;
POSITION-top: -430px !important;
position: fixed !important;
width: 1000px !important;
left: 50% !important;
POSITION-left: -500px !important;
z-index: 999 !important;
}

Instead of this:

#small-nav {
border-color: transparent !important;
background-color: transparent !important;
margin-top: -430px !important;
position: fixed !important;
width: 1000px !important;
left: 50% !important;
margin-left: -500px !important;
z-index: 999 !important;
}

Do this:

#small-nav {
    position: fixed;
    width: 100%;
    left: 0;
    top: 0;
}

#small-nav ul {
    width: auto;
}

Yikes, the entire navigation bar disappeared, for Chrome and Firefox. =S
And Safari remained the same.

I had all those margins and left properties because the entire navigation bar was in the wrong spot. Is there any workaround in this instance?

I cannot replicate your issue with the CSS I recommended, sorry.

Thanks for taking the time and effort for this anyway, Andrew. That’s very kind of you nonetheless. ??

If it helps, it’s still in that state currently using the code you suggested.

Don’t worry about it though. I’ve been banging my head against the table over this site for the past week. Haha!

Ah, I put the old code back in, and it returned to normal, even on the iPad. Strange really.

Thanks, Andrew!

I’ll now have to work out now why the featured images and infinity scroll function aren’t appearing in Safari.