panthro
panthro

Reputation: 24061

Off canvas menu with fixed page content

I have a fixed menu, I always want it at the top of my page:

.fixed-menu{
    position: fixed;
    height: 75px;
    width: 100%;
    background: tomato;
}

I also want an off canvas menu.

The problem I am having is that when you open the off canvas menu, the fixed menu is no longer fixed.

After playing with the issue, it's something to do with 3d transform, but I cannot find a fix.

Here is a JSFiddle

Upvotes: 0

Views: 173

Answers (1)

rafibomb
rafibomb

Reputation: 535

If you do it this way, the page is essentially locked when the menu is open http://codepen.io/rafibomb/pen/hApKk

Basically wrapping the content and making it overflowY: scroll;

article {
  overflow-y: auto;
}

Upvotes: 1

Related Questions