CSS box-shadow появится на верхних дочерних элементах

Question

У меня есть ul со вставкой box-shadow:

-webkit-box-shadow: inset 0px 0px 5px #000;
   -moz-box-shadow: inset 0px 0px 5px #000;
        box-shadow: inset 0px 0px 5px #000;

Я бы хотел, чтобы все дочерние элементы появлялись под этой тенью.

См .: http://jsfiddle.net/jimsteinhart/XX36p/

Кто-нибудь знает, возможно ли это?

Answer 1

Позиционирование псевдоэлемента с тенью над ul:

ul:before{
    content:''; width:100%; height:100%;
    position:absolute; top:0; left:0;

    -webkit-box-shadow: inset 0px 0px 5px #000;
   -moz-box-shadow: inset 0px 0px 5px #000;
    box-shadow: inset 0px 0px 5px #000;}

Демо

Answer 2

Теперь есть решение!с псевдоэлементом и pointer-events:none;

ul:before{
  content:''; width:100%; height:100%;
  position:absolute; top:0; left:0;
  box-shadow: inset 0px 0px 10px
  pointer-events:none;
}

Демо