sticky navigation skips a few pixels when adding class

http://kchang.myshopify.com/

I’m trying things out and i can’t figure out why when you scroll down, the navigation menu kind of skips a few pixels and snaps. I jsfiddled it independently and cant seem to reproduce it.

.fixed {
position: fixed;
top: 0;
}

Does it have something to do with my fixed class?

Answer

It’s because it doesn’t consume any space, as soon as you take it out of the flow by setting it’s position to fixed.

Simply give .main-menu an absolute position, so that it will always be taken out of the flow.

Leave a Reply

Your email address will not be published. Required fields are marked *