Question

I have a drop down menu I’ve been working on and I can’t seem to figure out why the styling of the b order/box shadow won’t work on top of my fixed .menu2 div.

http://jsfiddle.net/rKaPN/53/

.menu ul li ul{
position:absolute;
right: 0px;
border:1px solid #C3D1EC;
/*box-shadow*/
-webkit-box-shadow:0 1px 5px #CCCCCC;
   -moz-box-shadow:0 1px 5px #CCCCCC;
        box-shadow:0 1px 5px #CCCCCC;
margin-top:-1px;
display:none;
padding:0px 16px 0px 0;
}

.menu-2 {
  position: fixed;
  top: 30px;
  left: 0px;
  width: 100%;
  height: 100px;
  background: #DDD;
  color: #fff;
}

Answer 1

Give it a higher z-index than the menu2 🙂

See: http://jsfiddle.net/rKaPN/55/

li.menu-right.drop-down ul {
    display: block !important;
    position: absolute;
    right: 0;
    z-index: 1;
}