CODEWITHSUNDEEP
htmlcss
newbie
newbie

Reputation: 3

How to make the opacity of box-shadow exclusive to the shadow and not the div

This is my code 

.navbar {
width: 100%;
height: 70px;
position: fixed;
background-color: white;
box-shadow: 0 0 1em #1d1d1d;    
}

Every time I run something under this e.g. something that has a background color the shadow goes under it and so does the rest of the content. Should I just layer it?

Upvotes: 0

Views: 262

Answers (1)

Danielle Mujica
Danielle Mujica

Reputation: 26

Based on the code you have, this should work. I think there is a possibility two things are happening here:

  1. Check if you are setting the z-index on the elements that are going above your fixed nav to a greater value or you could set a z-index value on .navbar to see if that helps.

  2. The other possibility is that you are setting the elements that are overlapping your .navbar to absolute. If that is the case, and this is necessary, you could set the z-index on .navbar to a greater value.

Hope that helps.

Upvotes: 1

Related Questions