Is there a way to fix overlay div and keep wrap div `overflow-y: scroll` at the same time?

[asmoker]

I want to fix menu tab on the top of page in iframe, is there a way to fix overlay div and keep wrap div overflow-y: scroll at the same time? Thanks

[PierBover]

Have you tried to put the overlay div outside the wrap and use position: fixed;?

[asmoker]

Yea, put the overlay div outside the wrap and use position: fixed could work. However, I use vue.js build a single page application likes your project vuex-apollo-example-project. For some reasons, I have to set the #app div style like that:

#app {
  position: fixed;
  -webkit-overflow-scrolling: touch;
  overflow-y:scroll;
}

So, the position: fixed menu in the SPA couldn't fix at the top of page. I have tried and found several methods but it's not useful. Thanks

[PierBover]

I would need to see an example to be able to help you...

Can you create a demo with Codepen, JSBin, or something?

[kikemx78]

Maybe related to this. Is there a way to keep a fixed elements 'fixed' behavior inside the iframe ? It seems impossible to make it work on iOS (Chrome & Safari). Please look at the nav element behavior on desktop and mobile (never getting fixed).

Demo https://bit.ly/2RalFZN Forked Repo https://bit.ly/2CToB4p

[PierBover]

Hmm it should work unless Apple has changed things.

I'll try to make a demo.