menu container – box shadow

• 

  usinarevista · Member · May 24, 2014 at 5:22 pm

  • Copy link
  • Add topic to favorites

  Hi guys! I couldn’t find a box-shadow that only obfuscated the bottom of the item. I tried changing the px’s values to no avail. Now I’m using this:

  .site-navigation {
  -moz-box-shadow: 5px 5px 5px #ccc;
  -webkit-box-shadow: 5px 5px 5px #ccc;
  box-shadow: 5px 5px 5px #ccc;
  }

  but if you notice there’s an undesirable shadow on the right side of the menu (which overlaps the background image). Is there any way to hide this right-border shadow?

  Thanks!

  Thanks

  The blog I need help with is: (visible only to logged in users)

• 

  thesacredpath · Member · May 26, 2014 at 9:49 pm

  • Copy link

  Hi, give the following a try. I set .site-navigation to position: relative and set the z-index to 1000 since the shadow was appearing behind the slider instead of in front of it.

  .site-navigation {
      -moz-box-shadow: 0 5px 5px 0 #CCCCCC;
      -webkit-box-shadow: 0 5px 5px 0 #CCCCCC;
      box-shadow: 0 5px 5px 0 #CCCCCC;
      position: relative;
      z-index: 1000;
  }

• 

  usinarevista · Member · May 26, 2014 at 11:37 pm

  • Copy link

  thanks! perfect