Media Player scrolls in front of header

  • Resolved manuel144

    (@manuel144)


    9 years ago

    Hey guys,

    I built a homepage with the tesseract theme, which I really like. I made the header stay fixed at the top while scrolling by modifying the site-banner.css file. Everything works fine except the audio player which scrolls in front of the header, which of course isn’t very nice. I use the CUE Audio Player.

    Can anyone help me how to make it scroll behind the header? I can’t seem to figure it out. (By the way, I also included Youtube-Videos and those scroll behind the header just fine). Thís is the part of the website: https://www.zebrathought.de/#media

    Thanks!!

Viewing 2 replies - 1 through 2 (of 2 total)

  • Hi there Manuel144!
    You can easily change this by using the z-index. The z-index property specifies the stack order of an element. The element with the highest z-index value will be in the front.

    Try this code:

    #masthead {
    z-index: 15;
}

    Thread Starter manuel144

    (@manuel144)

    thanks for the tip. had to try a few things and it didn’t seem to work in the #masthead sections, but I put it in the very top:

    .site-header { background-color: rgba(0, 0, 0, 0.2); z-index: 15;}

    That works!

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Media Player scrolls in front of header’ is closed to new replies.