Jump to content

Photo's go through navbar


Sybrand

Recommended Posts

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;
}

 

2019-03-30 21_11_03-Sybrand Bos portfolio website.png

Link to comment
Share on other sites

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

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

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 account

Sign in

Already have an account? Sign in here.

Sign In Now
×
×
  • Create New...