i have header position:fixed , i'm trying implement amp-sidebar component.
amp creating -amp-fixedlayer adding style="top: calc(0px); pointer-events: initial; z-index: 10000;" fix scrolling performance in safari ("[fixedlayer]" "in order improve scrolling performance in safari, move element fixed positioning layer:" )
the problem since amp-sidebar component has z-index:9999!important in styles, fixedlayer displayed in top of sidebar.
i thought wrapping amp-sidebar , add z-index want, parent tag amp-sidebar can 'body'
any ideas how fix this?
i had same issue , after fiddling bit found way edit z-index of header.
amp puts z-index thinks needed can tweak values. instance:
header { position: fixed; z-index: -2000; width: 100%; background-color: black; opacity: 0.7; color: white; } this css code of header, trick here use negative z-index. amp take default value, add z-index style (negative in case) , put result in css.
so in case calculated z-index of header less sidebar's , therefore sidebar gets on top of header.
hope helps.
