Question 46088 in CSS Question posted in
Some basic documentation can be found here.

I added some CSS to get a sticky header but scrolling down pictures cover the header

I tryed to get a sticky header for my website https://sacconicase.com/case-vacanza/lignano-sabbiadoro-appartamenti-vacanze/

I found some CSS

#masthead {
position: sticky;
top: 0;
}

it works but not completely: when I scroll down the pictures cover the header

Tags:

2

Answers


  1. 0

    Add a z-index CSS property to #masthead to make its z-position higher than the images. Give masthead a z-index of 1 or higher to make it be above the other images.

    z-index of 0
    Screenshot of a website with various images of apartments. Two of the images jut into the header with portions of the images above the header.

    z-index of 1
    Screenshot of the same website with the header problem fixed; the images no longer appear above the header.

    Login or Signup to reply.
  2. 0

    Try removing position: relative on your images and that should work

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search