Sybrand Posted March 30, 2019 Share Posted March 30, 2019 Hi, I am making a portfolio website and i want to add a opacity to my pictures. But my navbar is sticky so it scrolls with the page but if i hover over a image it goes through the nav bar. Is there a way to fix this problem? I will add a picture to make it more clear. Hope you guys can help Thank You! /***************************** Code ************************************************/ .navigation-background{ grid-column: 1 / 4; display: grid; grid-template-columns: 20% 60% 20%; background-color: #2C2949; position: sticky; top: 0; width: 100%; } .navigation{ grid-column: 2 / 3; display: flex; flex-direction: row; justify-content: space-between; } Link to comment Share on other sites More sharing options...
Funce Posted April 3, 2019 Share Posted April 3, 2019 Try setting a higher z-index for your navigation bar. (If putting this on navigation doesn't work, try putting it elsewhere.) .navigation{ z-index: 500; } Link to comment Share on other sites More sharing options...
Sybrand Posted April 8, 2019 Author Share Posted April 8, 2019 On 4/3/2019 at 2:46 AM, Funce said: Try setting a higher z-index for your navigation bar. (If putting this on navigation doesn't work, try putting it elsewhere.) .navigation{ z-index: 500; } Thanks! it worked Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now